@wordpress/editor 12.6.0 → 12.9.0

package/CHANGELOG.md

@@ -2,6 +2,12 @@
 
 ## Unreleased
 
+## 12.9.0 (2022-06-01)
+
+## 12.8.0 (2022-05-18)
+
+## 12.7.0 (2022-05-04)
+
 ## 12.6.0 (2022-04-21)
 
 ## 12.5.0 (2022-04-08)

package/build/components/editor-help/help-section-title.native.js

@@ -0,0 +1,43 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _element = require("@wordpress/element");
+
+var _reactNative = require("react-native");
+
+var _compose = require("@wordpress/compose");
+
+var _style = _interopRequireDefault(require("./style.scss"));
+
+/**
+ * External dependencies
+ */
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+const HelpSectionTitle = _ref => {
+  let {
+    children
+  } = _ref;
+  const helpSectionTitle = (0, _compose.usePreferredColorSchemeStyle)(_style.default.helpSectionTitle, _style.default.helpSectionTitleDark);
+  return (0, _element.createElement)(_reactNative.View, {
+    style: _style.default.helpSectionTitleContainer
+  }, (0, _element.createElement)(_reactNative.Text, {
+    style: helpSectionTitle
+  }, children));
+};
+
+var _default = HelpSectionTitle;
+exports.default = _default;
+//# sourceMappingURL=help-section-title.native.js.map

package/build/components/editor-help/help-section-title.native.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/editor/src/components/editor-help/help-section-title.native.js"],"names":["HelpSectionTitle","children","helpSectionTitle","styles","helpSectionTitleDark","helpSectionTitleContainer"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AAKA;;AAbA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAGA,MAAMA,gBAAgB,GAAG,QAAoB;AAAA,MAAlB;AAAEC,IAAAA;AAAF,GAAkB;AAC5C,QAAMC,gBAAgB,GAAG,2CACxBC,eAAOD,gBADiB,EAExBC,eAAOC,oBAFiB,CAAzB;AAKA,SACC,4BAAC,iBAAD;AAAM,IAAA,KAAK,EAAGD,eAAOE;AAArB,KACC,4BAAC,iBAAD;AAAM,IAAA,KAAK,EAAGH;AAAd,KAAmCD,QAAnC,CADD,CADD;AAKA,CAXD;;eAaeD,gB","sourcesContent":["/**\n * External dependencies\n */\nimport { Text, View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nconst HelpSectionTitle = ( { children } ) => {\n\tconst helpSectionTitle = usePreferredColorSchemeStyle(\n\t\tstyles.helpSectionTitle,\n\t\tstyles.helpSectionTitleDark\n\t);\n\n\treturn (\n\t\t<View style={ styles.helpSectionTitleContainer }>\n\t\t\t<Text style={ helpSectionTitle }>{ children }</Text>\n\t\t</View>\n\t);\n};\n\nexport default HelpSectionTitle;\n"]}

package/build/components/editor-help/help-topic-row.native.js

@@ -24,7 +24,8 @@ const HelpTopicRow = _ref => {
   let {
     label,
     icon,
-    screenName
+    screenName,
+    isLastItem
   } = _ref;
   const navigation = (0, _native.useNavigation)();
 
@@ -33,7 +34,7 @@ const HelpTopicRow = _ref => {
   };
 
   return (0, _element.createElement)(_components.TextControl, {
-    separatorType: "leftMargin",
+    separatorType: isLastItem ? 'none' : 'leftMargin',
     customActionButton: true,
     leftAlign: true,
     onPress: openSubSheet,

package/build/components/editor-help/help-topic-row.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/editor/src/components/editor-help/help-topic-row.native.js"],"names":["HelpTopicRow","label","icon","screenName","navigation","openSubSheet","navigate","chevronRight"],"mappings":";;;;;;;;;AAGA;;AAKA;;AACA;;AATA;AACA;AACA;;AAGA;AACA;AACA;AAIA,MAAMA,YAAY,GAAG,QAAmC;AAAA,MAAjC;AAAEC,IAAAA,KAAF;AAASC,IAAAA,IAAT;AAAeC,IAAAA;AAAf,GAAiC;AACvD,QAAMC,UAAU,GAAG,4BAAnB;;AAEA,QAAMC,YAAY,GAAG,MAAM;AAC1BD,IAAAA,UAAU,CAACE,QAAX,CAAqBH,UAArB;AACA,GAFD;;AAIA,SACC,4BAAC,uBAAD;AACC,IAAA,aAAa,EAAC,YADf;AAEC,IAAA,kBAAkB,MAFnB;AAGC,IAAA,SAAS,MAHV;AAIC,IAAA,OAAO,EAAGE,YAJX;AAKC,IAAA,KAAK,EAAGJ,KALT;AAMC,IAAA,IAAI,EAAGC;AANR,KAQC,4BAAC,gBAAD;AAAM,IAAA,IAAI,EAAGK;AAAb,IARD,CADD;AAYA,CAnBD;;eAqBeP,Y","sourcesContent":["/**\n * External dependencies\n */\nimport { useNavigation } from '@react-navigation/native';\n\n/**\n * WordPress dependencies\n */\nimport { TextControl, Icon } from '@wordpress/components';\nimport { chevronRight } from '@wordpress/icons';\n\nconst HelpTopicRow = ( { label, icon, screenName } ) => {\n\tconst navigation = useNavigation();\n\n\tconst openSubSheet = () => {\n\t\tnavigation.navigate( screenName );\n\t};\n\n\treturn (\n\t\t<TextControl\n\t\t\tseparatorType=\"leftMargin\"\n\t\t\tcustomActionButton\n\t\t\tleftAlign\n\t\t\tonPress={ openSubSheet }\n\t\t\tlabel={ label }\n\t\t\ticon={ icon }\n\t\t>\n\t\t\t<Icon icon={ chevronRight } />\n\t\t</TextControl>\n\t);\n};\n\nexport default HelpTopicRow;\n"]}
+{"version":3,"sources":["@wordpress/editor/src/components/editor-help/help-topic-row.native.js"],"names":["HelpTopicRow","label","icon","screenName","isLastItem","navigation","openSubSheet","navigate","chevronRight"],"mappings":";;;;;;;;;AAGA;;AAKA;;AACA;;AATA;AACA;AACA;;AAGA;AACA;AACA;AAIA,MAAMA,YAAY,GAAG,QAA+C;AAAA,MAA7C;AAAEC,IAAAA,KAAF;AAASC,IAAAA,IAAT;AAAeC,IAAAA,UAAf;AAA2BC,IAAAA;AAA3B,GAA6C;AACnE,QAAMC,UAAU,GAAG,4BAAnB;;AAEA,QAAMC,YAAY,GAAG,MAAM;AAC1BD,IAAAA,UAAU,CAACE,QAAX,CAAqBJ,UAArB;AACA,GAFD;;AAIA,SACC,4BAAC,uBAAD;AACC,IAAA,aAAa,EAAGC,UAAU,GAAG,MAAH,GAAY,YADvC;AAEC,IAAA,kBAAkB,MAFnB;AAGC,IAAA,SAAS,MAHV;AAIC,IAAA,OAAO,EAAGE,YAJX;AAKC,IAAA,KAAK,EAAGL,KALT;AAMC,IAAA,IAAI,EAAGC;AANR,KAQC,4BAAC,gBAAD;AAAM,IAAA,IAAI,EAAGM;AAAb,IARD,CADD;AAYA,CAnBD;;eAqBeR,Y","sourcesContent":["/**\n * External dependencies\n */\nimport { useNavigation } from '@react-navigation/native';\n\n/**\n * WordPress dependencies\n */\nimport { TextControl, Icon } from '@wordpress/components';\nimport { chevronRight } from '@wordpress/icons';\n\nconst HelpTopicRow = ( { label, icon, screenName, isLastItem } ) => {\n\tconst navigation = useNavigation();\n\n\tconst openSubSheet = () => {\n\t\tnavigation.navigate( screenName );\n\t};\n\n\treturn (\n\t\t<TextControl\n\t\t\tseparatorType={ isLastItem ? 'none' : 'leftMargin' }\n\t\t\tcustomActionButton\n\t\t\tleftAlign\n\t\t\tonPress={ openSubSheet }\n\t\t\tlabel={ label }\n\t\t\ticon={ icon }\n\t\t>\n\t\t\t<Icon icon={ chevronRight } />\n\t\t</TextControl>\n\t);\n};\n\nexport default HelpTopicRow;\n"]}

package/build/components/editor-help/icon-move-blocks.native.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _element = require("@wordpress/element");
+
+var _primitives = require("@wordpress/primitives");
+
+/**
+ * WordPress dependencies
+ */
+var _default = (0, _element.createElement)(_primitives.SVG, {
+  xmlns: "http://www.w3.org/2000/svg",
+  viewBox: "0 0 24 24"
+}, (0, _element.createElement)(_primitives.Path, {
+  d: "M9.53 17.47 9 16.94 7.94 18l.53.53 2 2 .53.53.53-.53 2-2 .53-.53L13 16.94l-.53.53-.72.72v-4.94h-1.5v4.94l-.72-.72Zm-1.06-14L7.94 4 9 5.06l.53-.53.72-.72v4.94h1.5V3.81l.72.72.53.53L14.06 4l-.53-.53-2-2L11 .94l-.53.53-2 2ZM4.53 9.53 5.06 9 4 7.94l-.53.53-2 2-.53.53.53.53 2 2 .53.53L5.06 13l-.53-.53-.72-.72h4.94v-1.5H3.81l.72-.72Zm14-1.06L18 7.94 16.94 9l.53.53.72.72h-4.94v1.5h4.94l-.72.72-.53.53L18 14.06l.53-.53 2-2 .53-.53-.53-.53-2-2Z"
+}));
+
+exports.default = _default;
+//# sourceMappingURL=icon-move-blocks.native.js.map

package/build/components/editor-help/icon-move-blocks.native.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/editor/src/components/editor-help/icon-move-blocks.native.js"],"names":[],"mappings":";;;;;;;;;AAGA;;AAHA;AACA;AACA;eAIC,4BAAC,eAAD;AAAK,EAAA,KAAK,EAAC,4BAAX;AAAwC,EAAA,OAAO,EAAC;AAAhD,GACC,4BAAC,gBAAD;AAAM,EAAA,CAAC,EAAC;AAAR,EADD,C","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { SVG, Path } from '@wordpress/primitives';\n\nexport default (\n\t<SVG xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\">\n\t\t<Path d=\"M9.53 17.47 9 16.94 7.94 18l.53.53 2 2 .53.53.53-.53 2-2 .53-.53L13 16.94l-.53.53-.72.72v-4.94h-1.5v4.94l-.72-.72Zm-1.06-14L7.94 4 9 5.06l.53-.53.72-.72v4.94h1.5V3.81l.72.72.53.53L14.06 4l-.53-.53-2-2L11 .94l-.53.53-2 2ZM4.53 9.53 5.06 9 4 7.94l-.53.53-2 2-.53.53.53.53 2 2 .53.53L5.06 13l-.53-.53-.72-.72h4.94v-1.5H3.81l.72-.72Zm14-1.06L18 7.94 16.94 9l.53.53.72.72h-4.94v1.5h4.94l-.72.72-.53.53L18 14.06l.53-.53 2-2 .53-.53-.53-.53-2-2Z\" />\n\t</SVG>\n);\n"]}

package/build/components/editor-help/index.native.js

@@ -27,8 +27,6 @@ var _data = require("@wordpress/data");
 
 var _editor = require("@wordpress/editor");
 
-var _compose = require("@wordpress/compose");
-
 var _reactNativeBridge = require("@wordpress/react-native-bridge");
 
 var _style = _interopRequireDefault(require("./style.scss"));
@@ -49,6 +47,10 @@ var _removeBlocks = _interopRequireDefault(require("./remove-blocks"));
 
 var _customizeBlocks = _interopRequireDefault(require("./customize-blocks"));
 
+var _iconMoveBlocks = _interopRequireDefault(require("./icon-move-blocks"));
+
+var _helpSectionTitle = _interopRequireDefault(require("./help-section-title"));
+
 /**
  * External dependencies
  */
@@ -70,7 +72,7 @@ const HELP_TOPICS = [{
   view: (0, _element.createElement)(_addBlocks.default, null)
 }, {
   label: (0, _i18n.__)('Move blocks'),
-  icon: _icons.alignJustify,
+  icon: _iconMoveBlocks.default,
   view: (0, _element.createElement)(_moveBlocks.default, null)
 }, {
   label: (0, _i18n.__)('Remove blocks'),
@@ -93,7 +95,6 @@ function EditorHelpTopics(_ref) {
   } = (0, _data.useSelect)(select => ({
     postType: select(_editor.store).getEditedPostAttribute('type')
   }));
-  const sectionTitle = (0, _compose.usePreferredColorSchemeStyle)(_style.default.helpDetailSectionHeading, _style.default.helpDetailSectionHeadingDark);
   const title = postType === 'page' ? (0, _i18n.__)('How to edit your page') : (0, _i18n.__)('How to edit your post');
   return (0, _element.createElement)(_components.BottomSheet, {
     isVisible: isVisible,
@@ -133,23 +134,21 @@ function EditorHelpTopics(_ref) {
          */
         marginTop: 0
       }
-    }), (0, _element.createElement)(_components.PanelBody, null, (0, _element.createElement)(_reactNative.Text, {
-      style: sectionTitle
-    }, (0, _i18n.__)('The basics')), HELP_TOPICS.map(_ref3 => {
+    }), (0, _element.createElement)(_components.PanelBody, null, (0, _element.createElement)(_helpSectionTitle.default, null, (0, _i18n.__)('The basics')), HELP_TOPICS.map((_ref3, index) => {
       let {
         label,
         icon
       } = _ref3;
       const labelSlug = (0, _lodash.kebabCase)(label);
+      const isLastItem = index === HELP_TOPICS.length - 1;
       return (0, _element.createElement)(_helpTopicRow.default, {
         key: labelSlug,
         label: label,
         icon: icon,
-        screenName: labelSlug
+        screenName: labelSlug,
+        isLastItem: isLastItem
       });
-    }), (0, _element.createElement)(_reactNative.Text, {
-      style: sectionTitle
-    }, (0, _i18n.__)('Get support')), (0, _element.createElement)(_helpGetSupportButton.default, {
+    }), (0, _element.createElement)(_helpSectionTitle.default, null, (0, _i18n.__)('Get support')), (0, _element.createElement)(_helpGetSupportButton.default, {
       title: (0, _i18n.__)('Contact support'),
       onPress: _reactNativeBridge.requestContactCustomerSupport
     }), (0, _element.createElement)(_helpGetSupportButton.default, {

package/build/components/editor-help/index.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/editor/src/components/editor-help/index.native.js"],"names":["HELP_TOPICS","label","icon","helpFilled","view","plusCircleFilled","alignJustify","trash","cog","EditorHelpTopics","close","isVisible","onClose","postType","select","editorStore","getEditedPostAttribute","sectionTitle","styles","helpDetailSectionHeading","helpDetailSectionHeadingDark","title","contentContainer","navigationContainer","container","listProps","contentContainerStyle","StyleSheet","flatten","paddingBottom","Math","max","safeAreaBottomInset","marginTop","map","labelSlug","requestContactCustomerSupport","requestGotoCustomerSupportOptions","gestureEnabled","TransitionPresets","DefaultTransition"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { kebabCase } from 'lodash';\nimport { Text, SafeAreaView, ScrollView, StyleSheet, View } from 'react-native';\nimport { TransitionPresets } from '@react-navigation/stack';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tBottomSheet,\n\tBottomSheetConsumer,\n\tPanelBody,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport {\n\thelpFilled,\n\tplusCircleFilled,\n\talignJustify,\n\ttrash,\n\tcog,\n} from '@wordpress/icons';\nimport { useSelect } from '@wordpress/data';\nimport { store as editorStore } from '@wordpress/editor';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\nimport {\n\trequestContactCustomerSupport,\n\trequestGotoCustomerSupportOptions,\n} from '@wordpress/react-native-bridge';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\nimport HelpDetailNavigationScreen from './help-detail-navigation-screen';\nimport HelpTopicRow from './help-topic-row';\nimport HelpGetSupportButton from './help-get-support-button';\nimport IntroToBlocks from './intro-to-blocks';\nimport AddBlocks from './add-blocks';\nimport MoveBlocks from './move-blocks';\nimport RemoveBlocks from './remove-blocks';\nimport CustomizeBlocks from './customize-blocks';\n\nconst HELP_TOPICS = [\n\t{\n\t\tlabel: __( 'What is a block?' ),\n\t\ticon: helpFilled,\n\t\tview: <IntroToBlocks />,\n\t},\n\t{\n\t\tlabel: __( 'Add blocks' ),\n\t\ticon: plusCircleFilled,\n\t\tview: <AddBlocks />,\n\t},\n\t{ label: __( 'Move blocks' ), icon: alignJustify, view: <MoveBlocks /> },\n\t{ label: __( 'Remove blocks' ), icon: trash, view: <RemoveBlocks /> },\n\t{\n\t\tlabel: __( 'Customize blocks' ),\n\t\ticon: cog,\n\t\tview: <CustomizeBlocks />,\n\t},\n];\n\nfunction EditorHelpTopics( { close, isVisible, onClose } ) {\n\tconst { postType } = useSelect( ( select ) => ( {\n\t\tpostType: select( editorStore ).getEditedPostAttribute( 'type' ),\n\t} ) );\n\n\tconst sectionTitle = usePreferredColorSchemeStyle(\n\t\tstyles.helpDetailSectionHeading,\n\t\tstyles.helpDetailSectionHeadingDark\n\t);\n\n\tconst title =\n\t\tpostType === 'page'\n\t\t\t? __( 'How to edit your page' )\n\t\t\t: __( 'How to edit your post' );\n\n\treturn (\n\t\t<BottomSheet\n\t\t\tisVisible={ isVisible }\n\t\t\tonClose={ onClose }\n\t\t\thideHeader\n\t\t\thasNavigation\n\t\t\tcontentStyle={ styles.contentContainer }\n\t\t\ttestID=\"editor-help-modal\"\n\t\t>\n\t\t\t<SafeAreaView>\n\t\t\t\t<BottomSheet.NavigationContainer\n\t\t\t\t\tanimate\n\t\t\t\t\tmain\n\t\t\t\t\tstyle={ styles.navigationContainer }\n\t\t\t\t>\n\t\t\t\t\t<BottomSheet.NavigationScreen\n\t\t\t\t\t\tisScrollable\n\t\t\t\t\t\tfullScreen\n\t\t\t\t\t\tname=\"help-topics\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<View style={ styles.container }>\n\t\t\t\t\t\t\t<BottomSheet.NavBar>\n\t\t\t\t\t\t\t\t<BottomSheet.NavBar.DismissButton\n\t\t\t\t\t\t\t\t\tonPress={ close }\n\t\t\t\t\t\t\t\t\tiosText={ __( 'Close' ) }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t<BottomSheet.NavBar.Heading>\n\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t</BottomSheet.NavBar.Heading>\n\t\t\t\t\t\t\t</BottomSheet.NavBar>\n\t\t\t\t\t\t\t<BottomSheetConsumer>\n\t\t\t\t\t\t\t\t{ ( { listProps } ) => {\n\t\t\t\t\t\t\t\t\tconst contentContainerStyle = StyleSheet.flatten(\n\t\t\t\t\t\t\t\t\t\tlistProps.contentContainerStyle\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<ScrollView\n\t\t\t\t\t\t\t\t\t\t\t{ ...listProps }\n\t\t\t\t\t\t\t\t\t\t\tcontentContainerStyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\t...contentContainerStyle,\n\t\t\t\t\t\t\t\t\t\t\t\tpaddingBottom: Math.max(\n\t\t\t\t\t\t\t\t\t\t\t\t\tlistProps.safeAreaBottomInset,\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontentContainerStyle.paddingBottom\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\t/**\n\t\t\t\t\t\t\t\t\t\t\t\t * Remove margin set via `hideHeader`. Combining a header\n\t\t\t\t\t\t\t\t\t\t\t\t * and navigation in this bottom sheet is at odds with the\n\t\t\t\t\t\t\t\t\t\t\t\t * current `BottomSheet` implementation.\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\tmarginTop: 0,\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\t\t<PanelBody>\n\t\t\t\t\t\t\t\t\t\t\t\t<Text style={ sectionTitle }>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'The basics' ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t\t\t\t\t{ /* Print out help topics. */ }\n\t\t\t\t\t\t\t\t\t\t\t\t{ HELP_TOPICS.map(\n\t\t\t\t\t\t\t\t\t\t\t\t\t( { label, icon } ) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst labelSlug = kebabCase(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<HelpTopicRow\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlabelSlug\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenName={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlabelSlug\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\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\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={ sectionTitle }\n\t\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'Get support' ) }\n\t\t\t\t\t\t\t\t\t\t\t\t\t</Text>\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\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t<HelpGetSupportButton\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttitle={ __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Contact support'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonPress={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\trequestContactCustomerSupport\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\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\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t<HelpGetSupportButton\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttitle={ __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'More support options'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonPress={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\trequestGotoCustomerSupportOptions\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\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</PanelBody>\n\t\t\t\t\t\t\t\t\t\t</ScrollView>\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</BottomSheetConsumer>\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</BottomSheet.NavigationScreen>\n\t\t\t\t\t{ /* Print out help detail screens. */ }\n\t\t\t\t\t{ HELP_TOPICS.map( ( { view, label } ) => {\n\t\t\t\t\t\tconst labelSlug = kebabCase( label );\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<HelpDetailNavigationScreen\n\t\t\t\t\t\t\t\tkey={ labelSlug }\n\t\t\t\t\t\t\t\tname={ labelSlug }\n\t\t\t\t\t\t\t\tcontent={ view }\n\t\t\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\t\t\toptions={ {\n\t\t\t\t\t\t\t\t\tgestureEnabled: false,\n\t\t\t\t\t\t\t\t\t...TransitionPresets.DefaultTransition,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</BottomSheet.NavigationContainer>\n\t\t\t</SafeAreaView>\n\t\t</BottomSheet>\n\t);\n}\n\nexport default EditorHelpTopics;\n"]}
+{"version":3,"sources":["@wordpress/editor/src/components/editor-help/index.native.js"],"names":["HELP_TOPICS","label","icon","helpFilled","view","plusCircleFilled","moveBlocksIcon","trash","cog","EditorHelpTopics","close","isVisible","onClose","postType","select","editorStore","getEditedPostAttribute","title","styles","contentContainer","navigationContainer","container","listProps","contentContainerStyle","StyleSheet","flatten","paddingBottom","Math","max","safeAreaBottomInset","marginTop","map","index","labelSlug","isLastItem","length","requestContactCustomerSupport","requestGotoCustomerSupportOptions","gestureEnabled","TransitionPresets","DefaultTransition"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { kebabCase } from 'lodash';\nimport { SafeAreaView, ScrollView, StyleSheet, View } from 'react-native';\nimport { TransitionPresets } from '@react-navigation/stack';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tBottomSheet,\n\tBottomSheetConsumer,\n\tPanelBody,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { helpFilled, plusCircleFilled, trash, cog } from '@wordpress/icons';\nimport { useSelect } from '@wordpress/data';\nimport { store as editorStore } from '@wordpress/editor';\nimport {\n\trequestContactCustomerSupport,\n\trequestGotoCustomerSupportOptions,\n} from '@wordpress/react-native-bridge';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\nimport HelpDetailNavigationScreen from './help-detail-navigation-screen';\nimport HelpTopicRow from './help-topic-row';\nimport HelpGetSupportButton from './help-get-support-button';\nimport IntroToBlocks from './intro-to-blocks';\nimport AddBlocks from './add-blocks';\nimport MoveBlocks from './move-blocks';\nimport RemoveBlocks from './remove-blocks';\nimport CustomizeBlocks from './customize-blocks';\nimport moveBlocksIcon from './icon-move-blocks';\nimport HelpSectionTitle from './help-section-title';\n\nconst HELP_TOPICS = [\n\t{\n\t\tlabel: __( 'What is a block?' ),\n\t\ticon: helpFilled,\n\t\tview: <IntroToBlocks />,\n\t},\n\t{\n\t\tlabel: __( 'Add blocks' ),\n\t\ticon: plusCircleFilled,\n\t\tview: <AddBlocks />,\n\t},\n\t{ label: __( 'Move blocks' ), icon: moveBlocksIcon, view: <MoveBlocks /> },\n\t{ label: __( 'Remove blocks' ), icon: trash, view: <RemoveBlocks /> },\n\t{\n\t\tlabel: __( 'Customize blocks' ),\n\t\ticon: cog,\n\t\tview: <CustomizeBlocks />,\n\t},\n];\n\nfunction EditorHelpTopics( { close, isVisible, onClose } ) {\n\tconst { postType } = useSelect( ( select ) => ( {\n\t\tpostType: select( editorStore ).getEditedPostAttribute( 'type' ),\n\t} ) );\n\n\tconst title =\n\t\tpostType === 'page'\n\t\t\t? __( 'How to edit your page' )\n\t\t\t: __( 'How to edit your post' );\n\n\treturn (\n\t\t<BottomSheet\n\t\t\tisVisible={ isVisible }\n\t\t\tonClose={ onClose }\n\t\t\thideHeader\n\t\t\thasNavigation\n\t\t\tcontentStyle={ styles.contentContainer }\n\t\t\ttestID=\"editor-help-modal\"\n\t\t>\n\t\t\t<SafeAreaView>\n\t\t\t\t<BottomSheet.NavigationContainer\n\t\t\t\t\tanimate\n\t\t\t\t\tmain\n\t\t\t\t\tstyle={ styles.navigationContainer }\n\t\t\t\t>\n\t\t\t\t\t<BottomSheet.NavigationScreen\n\t\t\t\t\t\tisScrollable\n\t\t\t\t\t\tfullScreen\n\t\t\t\t\t\tname=\"help-topics\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<View style={ styles.container }>\n\t\t\t\t\t\t\t<BottomSheet.NavBar>\n\t\t\t\t\t\t\t\t<BottomSheet.NavBar.DismissButton\n\t\t\t\t\t\t\t\t\tonPress={ close }\n\t\t\t\t\t\t\t\t\tiosText={ __( 'Close' ) }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t<BottomSheet.NavBar.Heading>\n\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t</BottomSheet.NavBar.Heading>\n\t\t\t\t\t\t\t</BottomSheet.NavBar>\n\t\t\t\t\t\t\t<BottomSheetConsumer>\n\t\t\t\t\t\t\t\t{ ( { listProps } ) => {\n\t\t\t\t\t\t\t\t\tconst contentContainerStyle = StyleSheet.flatten(\n\t\t\t\t\t\t\t\t\t\tlistProps.contentContainerStyle\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<ScrollView\n\t\t\t\t\t\t\t\t\t\t\t{ ...listProps }\n\t\t\t\t\t\t\t\t\t\t\tcontentContainerStyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\t...contentContainerStyle,\n\t\t\t\t\t\t\t\t\t\t\t\tpaddingBottom: Math.max(\n\t\t\t\t\t\t\t\t\t\t\t\t\tlistProps.safeAreaBottomInset,\n\t\t\t\t\t\t\t\t\t\t\t\t\tcontentContainerStyle.paddingBottom\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\t/**\n\t\t\t\t\t\t\t\t\t\t\t\t * Remove margin set via `hideHeader`. Combining a header\n\t\t\t\t\t\t\t\t\t\t\t\t * and navigation in this bottom sheet is at odds with the\n\t\t\t\t\t\t\t\t\t\t\t\t * current `BottomSheet` implementation.\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\tmarginTop: 0,\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\t\t<PanelBody>\n\t\t\t\t\t\t\t\t\t\t\t\t<HelpSectionTitle>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'The basics' ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</HelpSectionTitle>\n\t\t\t\t\t\t\t\t\t\t\t\t{ /* Print out help topics. */ }\n\t\t\t\t\t\t\t\t\t\t\t\t{ HELP_TOPICS.map(\n\t\t\t\t\t\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{ label, icon },\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex\n\t\t\t\t\t\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst labelSlug = kebabCase(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tconst isLastItem =\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex ===\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tHELP_TOPICS.length -\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t1;\n\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<HelpTopicRow\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tkey={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlabelSlug\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tscreenName={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tlabelSlug\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tisLastItem={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tisLastItem\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\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\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t<HelpSectionTitle>\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'Get support' ) }\n\t\t\t\t\t\t\t\t\t\t\t\t\t</HelpSectionTitle>\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\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t<HelpGetSupportButton\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttitle={ __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Contact support'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonPress={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\trequestContactCustomerSupport\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\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\t{\n\t\t\t\t\t\t\t\t\t\t\t\t\t<HelpGetSupportButton\n\t\t\t\t\t\t\t\t\t\t\t\t\t\ttitle={ __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'More support options'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonPress={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\trequestGotoCustomerSupportOptions\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\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</PanelBody>\n\t\t\t\t\t\t\t\t\t\t</ScrollView>\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</BottomSheetConsumer>\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</BottomSheet.NavigationScreen>\n\t\t\t\t\t{ /* Print out help detail screens. */ }\n\t\t\t\t\t{ HELP_TOPICS.map( ( { view, label } ) => {\n\t\t\t\t\t\tconst labelSlug = kebabCase( label );\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<HelpDetailNavigationScreen\n\t\t\t\t\t\t\t\tkey={ labelSlug }\n\t\t\t\t\t\t\t\tname={ labelSlug }\n\t\t\t\t\t\t\t\tcontent={ view }\n\t\t\t\t\t\t\t\tlabel={ label }\n\t\t\t\t\t\t\t\toptions={ {\n\t\t\t\t\t\t\t\t\tgestureEnabled: false,\n\t\t\t\t\t\t\t\t\t...TransitionPresets.DefaultTransition,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\t\t\t\t\t} ) }\n\t\t\t\t</BottomSheet.NavigationContainer>\n\t\t\t</SafeAreaView>\n\t\t</BottomSheet>\n\t);\n}\n\nexport default EditorHelpTopics;\n"]}

package/build/components/editor-help/move-blocks.native.js

@@ -30,12 +30,24 @@ var _viewSections = require("./view-sections");
  */
 const MoveBlocks = () => {
   return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_viewSections.HelpDetailImage, {
+    source: require('./images/drag-and-drop-light.png'),
+    sourceDarkMode: require('./images/drag-and-drop-dark.png')
+  }), (0, _element.createElement)(_reactNative.View, {
+    style: _style.default.helpDetailContainer
+  }, (0, _element.createElement)(_viewSections.HelpDetailSectionHeadingText, {
+    text: (0, _i18n.__)('Drag & drop'),
+    badge: (0, _i18n.__)('NEW')
+  }), (0, _element.createElement)(_viewSections.HelpDetailBodyText, {
+    text: (0, _i18n.__)('Drag & drop makes rearranging blocks a breeze. Press and hold on a block, then drag it to its new location and release.')
+  })), (0, _element.createElement)(_viewSections.HelpDetailImage, {
     source: require('./images/move-light.png'),
     sourceDarkMode: require('./images/move-dark.png')
   }), (0, _element.createElement)(_reactNative.View, {
     style: _style.default.helpDetailContainer
-  }, (0, _element.createElement)(_viewSections.HelpDetailBodyText, {
-    text: (0, _i18n.__)('You can rearrange blocks by tapping a block and then tapping the up and down arrows that appear on the bottom left side of the block to move it above or below other blocks.')
+  }, (0, _element.createElement)(_viewSections.HelpDetailSectionHeadingText, {
+    text: (0, _i18n.__)('Arrow buttons')
+  }), (0, _element.createElement)(_viewSections.HelpDetailBodyText, {
+    text: (0, _i18n.__)('You can also rearrange blocks by tapping a block and then tapping the up and down arrows that appear on the bottom left side of the block to move it up or down.')
   })));
 };
 

package/build/components/editor-help/move-blocks.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/editor/src/components/editor-help/move-blocks.native.js"],"names":["MoveBlocks","require","styles","helpDetailContainer"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AAKA;;AACA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAIA,MAAMA,UAAU,GAAG,MAAM;AACxB,SACC,qDACC,4BAAC,6BAAD;AACC,IAAA,MAAM,EAAGC,OAAO,CAAE,yBAAF,CADjB;AAEC,IAAA,cAAc,EAAGA,OAAO,CAAE,wBAAF;AAFzB,IADD,EAKC,4BAAC,iBAAD;AAAM,IAAA,KAAK,EAAGC,eAAOC;AAArB,KACC,4BAAC,gCAAD;AACC,IAAA,IAAI,EAAG,cACN,8KADM;AADR,IADD,CALD,CADD;AAeA,CAhBD;;eAkBeH,U","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\nimport { HelpDetailBodyText, HelpDetailImage } from './view-sections';\n\nconst MoveBlocks = () => {\n\treturn (\n\t\t<>\n\t\t\t<HelpDetailImage\n\t\t\t\tsource={ require( './images/move-light.png' ) }\n\t\t\t\tsourceDarkMode={ require( './images/move-dark.png' ) }\n\t\t\t/>\n\t\t\t<View style={ styles.helpDetailContainer }>\n\t\t\t\t<HelpDetailBodyText\n\t\t\t\t\ttext={ __(\n\t\t\t\t\t\t'You can rearrange blocks by tapping a block and then tapping the up and down arrows that appear on the bottom left side of the block to move it above or below other blocks.'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t</>\n\t);\n};\n\nexport default MoveBlocks;\n"]}
+{"version":3,"sources":["@wordpress/editor/src/components/editor-help/move-blocks.native.js"],"names":["MoveBlocks","require","styles","helpDetailContainer"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AAKA;;AACA;;AAdA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AAQA,MAAMA,UAAU,GAAG,MAAM;AACxB,SACC,qDACC,4BAAC,6BAAD;AACC,IAAA,MAAM,EAAGC,OAAO,CAAE,kCAAF,CADjB;AAEC,IAAA,cAAc,EAAGA,OAAO,CAAE,iCAAF;AAFzB,IADD,EAKC,4BAAC,iBAAD;AAAM,IAAA,KAAK,EAAGC,eAAOC;AAArB,KACC,4BAAC,0CAAD;AACC,IAAA,IAAI,EAAG,cAAI,aAAJ,CADR;AAEC,IAAA,KAAK,EAAG,cAAI,KAAJ;AAFT,IADD,EAKC,4BAAC,gCAAD;AACC,IAAA,IAAI,EAAG,cACN,yHADM;AADR,IALD,CALD,EAgBC,4BAAC,6BAAD;AACC,IAAA,MAAM,EAAGF,OAAO,CAAE,yBAAF,CADjB;AAEC,IAAA,cAAc,EAAGA,OAAO,CAAE,wBAAF;AAFzB,IAhBD,EAoBC,4BAAC,iBAAD;AAAM,IAAA,KAAK,EAAGC,eAAOC;AAArB,KACC,4BAAC,0CAAD;AAA8B,IAAA,IAAI,EAAG,cAAI,eAAJ;AAArC,IADD,EAEC,4BAAC,gCAAD;AACC,IAAA,IAAI,EAAG,cACN,kKADM;AADR,IAFD,CApBD,CADD;AA+BA,CAhCD;;eAkCeH,U","sourcesContent":["/**\n * External dependencies\n */\nimport { View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\nimport {\n\tHelpDetailBodyText,\n\tHelpDetailImage,\n\tHelpDetailSectionHeadingText,\n} from './view-sections';\n\nconst MoveBlocks = () => {\n\treturn (\n\t\t<>\n\t\t\t<HelpDetailImage\n\t\t\t\tsource={ require( './images/drag-and-drop-light.png' ) }\n\t\t\t\tsourceDarkMode={ require( './images/drag-and-drop-dark.png' ) }\n\t\t\t/>\n\t\t\t<View style={ styles.helpDetailContainer }>\n\t\t\t\t<HelpDetailSectionHeadingText\n\t\t\t\t\ttext={ __( 'Drag & drop' ) }\n\t\t\t\t\tbadge={ __( 'NEW' ) }\n\t\t\t\t/>\n\t\t\t\t<HelpDetailBodyText\n\t\t\t\t\ttext={ __(\n\t\t\t\t\t\t'Drag & drop makes rearranging blocks a breeze. Press and hold on a block, then drag it to its new location and release.'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t\t<HelpDetailImage\n\t\t\t\tsource={ require( './images/move-light.png' ) }\n\t\t\t\tsourceDarkMode={ require( './images/move-dark.png' ) }\n\t\t\t/>\n\t\t\t<View style={ styles.helpDetailContainer }>\n\t\t\t\t<HelpDetailSectionHeadingText text={ __( 'Arrow buttons' ) } />\n\t\t\t\t<HelpDetailBodyText\n\t\t\t\t\ttext={ __(\n\t\t\t\t\t\t'You can also rearrange blocks by tapping a block and then tapping the up and down arrows that appear on the bottom left side of the block to move it up or down.'\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t</>\n\t);\n};\n\nexport default MoveBlocks;\n"]}

package/build/components/editor-help/view-sections.native.js

@@ -41,14 +41,19 @@ exports.HelpDetailBodyText = HelpDetailBodyText;
 
 const HelpDetailSectionHeadingText = _ref2 => {
   let {
-    text
+    text,
+    badge
   } = _ref2;
-  const headingStyle = (0, _compose.usePreferredColorSchemeStyle)(_style.default.helpDetailSectionHeading, _style.default.helpDetailSectionHeadingDark);
-  return (0, _element.createElement)(_reactNative.Text, {
+  const headingTextStyle = (0, _compose.usePreferredColorSchemeStyle)(_style.default.helpDetailSectionHeadingText, _style.default.helpDetailSectionHeadingTextDark);
+  return (0, _element.createElement)(_reactNative.View, {
+    style: _style.default.helpDetailSectionHeading
+  }, badge && (0, _element.createElement)(HelpDetailBadge, {
+    text: badge
+  }), (0, _element.createElement)(_reactNative.Text, {
     accessibilityRole: "header",
     selectable: true,
-    style: headingStyle
-  }, text);
+    style: headingTextStyle
+  }, text));
 };
 
 exports.HelpDetailSectionHeadingText = HelpDetailSectionHeadingText;
@@ -71,4 +76,15 @@ const HelpDetailImage = _ref3 => {
 };
 
 exports.HelpDetailImage = HelpDetailImage;
+
+const HelpDetailBadge = _ref4 => {
+  let {
+    text
+  } = _ref4;
+  return (0, _element.createElement)(_reactNative.View, {
+    style: _style.default.helpDetailBadgeContainer
+  }, (0, _element.createElement)(_reactNative.Text, {
+    style: _style.default.helpDetailBadgeText
+  }, text));
+};
 //# sourceMappingURL=view-sections.native.js.map

package/build/components/editor-help/view-sections.native.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/editor/src/components/editor-help/view-sections.native.js"],"names":["HelpDetailBodyText","text","bodyStyle","styles","helpDetailBody","helpDetailBodyDark","HelpDetailSectionHeadingText","headingStyle","helpDetailSectionHeading","helpDetailSectionHeadingDark","HelpDetailImage","accessible","accessibilityLabel","source","sourceDarkMode","imageStyle","helpDetailImage","helpDetailImageDark","darkModeEnabled"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AAQA;;AAhBA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;AAGO,MAAMA,kBAAkB,GAAG,QAAgB;AAAA,MAAd;AAAEC,IAAAA;AAAF,GAAc;AACjD,QAAMC,SAAS,GAAG,2CACjBC,eAAOC,cADU,EAEjBD,eAAOE,kBAFU,CAAlB;AAIA,SACC,4BAAC,iBAAD;AAAM,IAAA,UAAU,MAAhB;AAAiB,IAAA,KAAK,EAAGH;AAAzB,KACGD,IADH,CADD;AAKA,CAVM;;;;AAYA,MAAMK,4BAA4B,GAAG,SAAgB;AAAA,MAAd;AAAEL,IAAAA;AAAF,GAAc;AAC3D,QAAMM,YAAY,GAAG,2CACpBJ,eAAOK,wBADa,EAEpBL,eAAOM,4BAFa,CAArB;AAIA,SACC,4BAAC,iBAAD;AAAM,IAAA,iBAAiB,EAAC,QAAxB;AAAiC,IAAA,UAAU,MAA3C;AAA4C,IAAA,KAAK,EAAGF;AAApD,KACGN,IADH,CADD;AAKA,CAVM;;;;AAYA,MAAMS,eAAe,GAAG,SAKxB;AAAA,MAL0B;AAChCC,IAAAA,UADgC;AAEhCC,IAAAA,kBAFgC;AAGhCC,IAAAA,MAHgC;AAIhCC,IAAAA;AAJgC,GAK1B;AACN,QAAMC,UAAU,GAAG,2CAClBZ,eAAOa,eADW,EAElBb,eAAOc,mBAFW,CAAnB;AAIA,QAAMC,eAAe,GAAG,4CAA8B,MAAtD;AACA,SACC,4BAAC,kBAAD;AACC,IAAA,UAAU,EAAGP,UADd;AAEC,IAAA,kBAAkB,EAAGC,kBAFtB;AAGC,IAAA,MAAM,EACLM,eAAe,IAAIJ,cAAnB,GAAoCA,cAApC,GAAqDD,MAJvD;AAMC,IAAA,KAAK,EAAGE;AANT,IADD;AAUA,CArBM","sourcesContent":["/**\n * External dependencies\n */\nimport { Text, Image } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tusePreferredColorScheme,\n\tusePreferredColorSchemeStyle,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nexport const HelpDetailBodyText = ( { text } ) => {\n\tconst bodyStyle = usePreferredColorSchemeStyle(\n\t\tstyles.helpDetailBody,\n\t\tstyles.helpDetailBodyDark\n\t);\n\treturn (\n\t\t<Text selectable style={ bodyStyle }>\n\t\t\t{ text }\n\t\t</Text>\n\t);\n};\n\nexport const HelpDetailSectionHeadingText = ( { text } ) => {\n\tconst headingStyle = usePreferredColorSchemeStyle(\n\t\tstyles.helpDetailSectionHeading,\n\t\tstyles.helpDetailSectionHeadingDark\n\t);\n\treturn (\n\t\t<Text accessibilityRole=\"header\" selectable style={ headingStyle }>\n\t\t\t{ text }\n\t\t</Text>\n\t);\n};\n\nexport const HelpDetailImage = ( {\n\taccessible,\n\taccessibilityLabel,\n\tsource,\n\tsourceDarkMode,\n} ) => {\n\tconst imageStyle = usePreferredColorSchemeStyle(\n\t\tstyles.helpDetailImage,\n\t\tstyles.helpDetailImageDark\n\t);\n\tconst darkModeEnabled = usePreferredColorScheme() === 'dark';\n\treturn (\n\t\t<Image\n\t\t\taccessible={ accessible }\n\t\t\taccessibilityLabel={ accessibilityLabel }\n\t\t\tsource={\n\t\t\t\tdarkModeEnabled && sourceDarkMode ? sourceDarkMode : source\n\t\t\t}\n\t\t\tstyle={ imageStyle }\n\t\t/>\n\t);\n};\n"]}
+{"version":3,"sources":["@wordpress/editor/src/components/editor-help/view-sections.native.js"],"names":["HelpDetailBodyText","text","bodyStyle","styles","helpDetailBody","helpDetailBodyDark","HelpDetailSectionHeadingText","badge","headingTextStyle","helpDetailSectionHeadingText","helpDetailSectionHeadingTextDark","helpDetailSectionHeading","HelpDetailImage","accessible","accessibilityLabel","source","sourceDarkMode","imageStyle","helpDetailImage","helpDetailImageDark","darkModeEnabled","HelpDetailBadge","helpDetailBadgeContainer","helpDetailBadgeText"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AAQA;;AAhBA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;AAGO,MAAMA,kBAAkB,GAAG,QAAgB;AAAA,MAAd;AAAEC,IAAAA;AAAF,GAAc;AACjD,QAAMC,SAAS,GAAG,2CACjBC,eAAOC,cADU,EAEjBD,eAAOE,kBAFU,CAAlB;AAIA,SACC,4BAAC,iBAAD;AAAM,IAAA,UAAU,MAAhB;AAAiB,IAAA,KAAK,EAAGH;AAAzB,KACGD,IADH,CADD;AAKA,CAVM;;;;AAYA,MAAMK,4BAA4B,GAAG,SAAuB;AAAA,MAArB;AAAEL,IAAAA,IAAF;AAAQM,IAAAA;AAAR,GAAqB;AAClE,QAAMC,gBAAgB,GAAG,2CACxBL,eAAOM,4BADiB,EAExBN,eAAOO,gCAFiB,CAAzB;AAIA,SACC,4BAAC,iBAAD;AAAM,IAAA,KAAK,EAAGP,eAAOQ;AAArB,KACGJ,KAAK,IAAI,4BAAC,eAAD;AAAiB,IAAA,IAAI,EAAGA;AAAxB,IADZ,EAEC,4BAAC,iBAAD;AACC,IAAA,iBAAiB,EAAC,QADnB;AAEC,IAAA,UAAU,MAFX;AAGC,IAAA,KAAK,EAAGC;AAHT,KAKGP,IALH,CAFD,CADD;AAYA,CAjBM;;;;AAmBA,MAAMW,eAAe,GAAG,SAKxB;AAAA,MAL0B;AAChCC,IAAAA,UADgC;AAEhCC,IAAAA,kBAFgC;AAGhCC,IAAAA,MAHgC;AAIhCC,IAAAA;AAJgC,GAK1B;AACN,QAAMC,UAAU,GAAG,2CAClBd,eAAOe,eADW,EAElBf,eAAOgB,mBAFW,CAAnB;AAIA,QAAMC,eAAe,GAAG,4CAA8B,MAAtD;AACA,SACC,4BAAC,kBAAD;AACC,IAAA,UAAU,EAAGP,UADd;AAEC,IAAA,kBAAkB,EAAGC,kBAFtB;AAGC,IAAA,MAAM,EACLM,eAAe,IAAIJ,cAAnB,GAAoCA,cAApC,GAAqDD,MAJvD;AAMC,IAAA,KAAK,EAAGE;AANT,IADD;AAUA,CArBM;;;;AAuBP,MAAMI,eAAe,GAAG,SAAgB;AAAA,MAAd;AAAEpB,IAAAA;AAAF,GAAc;AACvC,SACC,4BAAC,iBAAD;AAAM,IAAA,KAAK,EAAGE,eAAOmB;AAArB,KACC,4BAAC,iBAAD;AAAM,IAAA,KAAK,EAAGnB,eAAOoB;AAArB,KAA6CtB,IAA7C,CADD,CADD;AAKA,CAND","sourcesContent":["/**\n * External dependencies\n */\nimport { Text, Image, View } from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tusePreferredColorScheme,\n\tusePreferredColorSchemeStyle,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\n\nexport const HelpDetailBodyText = ( { text } ) => {\n\tconst bodyStyle = usePreferredColorSchemeStyle(\n\t\tstyles.helpDetailBody,\n\t\tstyles.helpDetailBodyDark\n\t);\n\treturn (\n\t\t<Text selectable style={ bodyStyle }>\n\t\t\t{ text }\n\t\t</Text>\n\t);\n};\n\nexport const HelpDetailSectionHeadingText = ( { text, badge } ) => {\n\tconst headingTextStyle = usePreferredColorSchemeStyle(\n\t\tstyles.helpDetailSectionHeadingText,\n\t\tstyles.helpDetailSectionHeadingTextDark\n\t);\n\treturn (\n\t\t<View style={ styles.helpDetailSectionHeading }>\n\t\t\t{ badge && <HelpDetailBadge text={ badge } /> }\n\t\t\t<Text\n\t\t\t\taccessibilityRole=\"header\"\n\t\t\t\tselectable\n\t\t\t\tstyle={ headingTextStyle }\n\t\t\t>\n\t\t\t\t{ text }\n\t\t\t</Text>\n\t\t</View>\n\t);\n};\n\nexport const HelpDetailImage = ( {\n\taccessible,\n\taccessibilityLabel,\n\tsource,\n\tsourceDarkMode,\n} ) => {\n\tconst imageStyle = usePreferredColorSchemeStyle(\n\t\tstyles.helpDetailImage,\n\t\tstyles.helpDetailImageDark\n\t);\n\tconst darkModeEnabled = usePreferredColorScheme() === 'dark';\n\treturn (\n\t\t<Image\n\t\t\taccessible={ accessible }\n\t\t\taccessibilityLabel={ accessibilityLabel }\n\t\t\tsource={\n\t\t\t\tdarkModeEnabled && sourceDarkMode ? sourceDarkMode : source\n\t\t\t}\n\t\t\tstyle={ imageStyle }\n\t\t/>\n\t);\n};\n\nconst HelpDetailBadge = ( { text } ) => {\n\treturn (\n\t\t<View style={ styles.helpDetailBadgeContainer }>\n\t\t\t<Text style={ styles.helpDetailBadgeText }>{ text }</Text>\n\t\t</View>\n\t);\n};\n"]}

package/build/components/post-featured-image/index.js

@@ -17,6 +17,8 @@ var _hooks = require("@wordpress/hooks");
 
 var _components = require("@wordpress/components");
 
+var _blob = require("@wordpress/blob");
+
 var _compose = require("@wordpress/compose");
 
 var _data = require("@wordpress/data");
@@ -45,6 +47,41 @@ const ALLOWED_MEDIA_TYPES = ['image']; // Used when labels from post type were n
 const DEFAULT_FEATURE_IMAGE_LABEL = (0, _i18n.__)('Featured image');
 const DEFAULT_SET_FEATURE_IMAGE_LABEL = (0, _i18n.__)('Set featured image');
 const DEFAULT_REMOVE_FEATURE_IMAGE_LABEL = (0, _i18n.__)('Remove image');
+const instructions = (0, _element.createElement)("p", null, (0, _i18n.__)('To edit the featured image, you need permission to upload media.'));
+
+function getMediaDetails(media, postId) {
+  if (!media) {
+    return {};
+  }
+
+  const defaultSize = (0, _hooks.applyFilters)('editor.PostFeaturedImage.imageSize', 'large', media.id, postId);
+
+  if ((0, _lodash.has)(media, ['media_details', 'sizes', defaultSize])) {
+    return {
+      mediaWidth: media.media_details.sizes[defaultSize].width,
+      mediaHeight: media.media_details.sizes[defaultSize].height,
+      mediaSourceUrl: media.media_details.sizes[defaultSize].source_url
+    };
+  } // Use fallbackSize when defaultSize is not available.
+
+
+  const fallbackSize = (0, _hooks.applyFilters)('editor.PostFeaturedImage.imageSize', 'thumbnail', media.id, postId);
+
+  if ((0, _lodash.has)(media, ['media_details', 'sizes', fallbackSize])) {
+    return {
+      mediaWidth: media.media_details.sizes[fallbackSize].width,
+      mediaHeight: media.media_details.sizes[fallbackSize].height,
+      mediaSourceUrl: media.media_details.sizes[fallbackSize].source_url
+    };
+  } // Use full image size when fallbackSize and defaultSize are not available.
+
+
+  return {
+    mediaWidth: media.media_details.width,
+    mediaHeight: media.media_details.height,
+    mediaSourceUrl: media.source_url
+  };
+}
 
 function PostFeaturedImage(_ref) {
   var _media$media_details$, _media$media_details$2;
@@ -53,40 +90,46 @@ function PostFeaturedImage(_ref) {
     currentPostId,
     featuredImageId,
     onUpdateImage,
-    onDropImage,
     onRemoveImage,
     media,
     postType,
-    noticeUI
+    noticeUI,
+    noticeOperations
   } = _ref;
+  const [isLoading, setIsLoading] = (0, _element.useState)(false);
+  const mediaUpload = (0, _data.useSelect)(select => {
+    return select(_blockEditor.store).getSettings().mediaUpload;
+  }, []);
   const postLabel = (0, _lodash.get)(postType, ['labels'], {});
-  const instructions = (0, _element.createElement)("p", null, (0, _i18n.__)('To edit the featured image, you need permission to upload media.'));
-  let mediaWidth, mediaHeight, mediaSourceUrl;
-
-  if (media) {
-    const mediaSize = (0, _hooks.applyFilters)('editor.PostFeaturedImage.imageSize', 'post-thumbnail', media.id, currentPostId);
-
-    if ((0, _lodash.has)(media, ['media_details', 'sizes', mediaSize])) {
-      // Use mediaSize when available.
-      mediaWidth = media.media_details.sizes[mediaSize].width;
-      mediaHeight = media.media_details.sizes[mediaSize].height;
-      mediaSourceUrl = media.media_details.sizes[mediaSize].source_url;
-    } else {
-      // Get fallbackMediaSize if mediaSize is not available.
-      const fallbackMediaSize = (0, _hooks.applyFilters)('editor.PostFeaturedImage.imageSize', 'thumbnail', media.id, currentPostId);
-
-      if ((0, _lodash.has)(media, ['media_details', 'sizes', fallbackMediaSize])) {
-        // Use fallbackMediaSize when mediaSize is not available.
-        mediaWidth = media.media_details.sizes[fallbackMediaSize].width;
-        mediaHeight = media.media_details.sizes[fallbackMediaSize].height;
-        mediaSourceUrl = media.media_details.sizes[fallbackMediaSize].source_url;
-      } else {
-        // Use full image size when mediaFallbackSize and mediaSize are not available.
-        mediaWidth = media.media_details.width;
-        mediaHeight = media.media_details.height;
-        mediaSourceUrl = media.source_url;
+  const {
+    mediaWidth,
+    mediaHeight,
+    mediaSourceUrl
+  } = getMediaDetails(media, currentPostId);
+
+  function onDropFiles(filesList) {
+    mediaUpload({
+      allowedTypes: ['image'],
+      filesList,
+
+      onFileChange(_ref2) {
+        let [image] = _ref2;
+
+        if ((0, _blob.isBlobURL)(image === null || image === void 0 ? void 0 : image.url)) {
+          setIsLoading(true);
+          return;
+        }
+
+        onUpdateImage(image);
+        setIsLoading(false);
+      },
+
+      onError(message) {
+        noticeOperations.removeAllNotices();
+        noticeOperations.createErrorNotice(message);
       }
-    }
+
+    });
   }
 
   return (0, _element.createElement)(_check.default, null, noticeUI, (0, _element.createElement)("div", {
@@ -104,10 +147,10 @@ function PostFeaturedImage(_ref) {
     unstableFeaturedImageFlow: true,
     allowedTypes: ALLOWED_MEDIA_TYPES,
     modalClass: "editor-post-featured-image__media-modal",
-    render: _ref2 => {
+    render: _ref3 => {
       let {
         open
-      } = _ref2;
+      } = _ref3;
       return (0, _element.createElement)("div", {
         className: "editor-post-featured-image__container"
       }, (0, _element.createElement)(_components.Button, {
@@ -122,27 +165,27 @@ function PostFeaturedImage(_ref) {
       }, (0, _element.createElement)("img", {
         src: mediaSourceUrl,
         alt: ""
-      })), !!featuredImageId && !media && (0, _element.createElement)(_components.Spinner, null), !featuredImageId && (postLabel.set_featured_image || DEFAULT_SET_FEATURE_IMAGE_LABEL)), (0, _element.createElement)(_components.DropZone, {
-        onFilesDrop: onDropImage
+      })), isLoading && (0, _element.createElement)(_components.Spinner, null), !featuredImageId && !isLoading && (postLabel.set_featured_image || DEFAULT_SET_FEATURE_IMAGE_LABEL)), (0, _element.createElement)(_components.DropZone, {
+        onFilesDrop: onDropFiles
       }));
     },
     value: featuredImageId
-  })), !!featuredImageId && media && !media.isLoading && (0, _element.createElement)(_blockEditor.MediaUploadCheck, null, (0, _element.createElement)(_blockEditor.MediaUpload, {
+  })), !!featuredImageId && (0, _element.createElement)(_blockEditor.MediaUploadCheck, null, media && (0, _element.createElement)(_blockEditor.MediaUpload, {
     title: postLabel.featured_image || DEFAULT_FEATURE_IMAGE_LABEL,
     onSelect: onUpdateImage,
     unstableFeaturedImageFlow: true,
     allowedTypes: ALLOWED_MEDIA_TYPES,
     modalClass: "editor-post-featured-image__media-modal",
-    render: _ref3 => {
+    render: _ref4 => {
       let {
         open
-      } = _ref3;
+      } = _ref4;
       return (0, _element.createElement)(_components.Button, {
         onClick: open,
         variant: "secondary"
       }, (0, _i18n.__)('Replace Image'));
     }
-  })), !!featuredImageId && (0, _element.createElement)(_blockEditor.MediaUploadCheck, null, (0, _element.createElement)(_components.Button, {
+  }), (0, _element.createElement)(_components.Button, {
     onClick: onRemoveImage,
     variant: "link",
     isDestructive: true
@@ -168,13 +211,13 @@ const applyWithSelect = (0, _data.withSelect)(select => {
     featuredImageId
   };
 });
-const applyWithDispatch = (0, _data.withDispatch)((dispatch, _ref4, _ref5) => {
+const applyWithDispatch = (0, _data.withDispatch)((dispatch, _ref5, _ref6) => {
   let {
     noticeOperations
-  } = _ref4;
+  } = _ref5;
   let {
     select
-  } = _ref5;
+  } = _ref6;
   const {
     editPost
   } = dispatch(_store.store);
@@ -190,8 +233,8 @@ const applyWithDispatch = (0, _data.withDispatch)((dispatch, _ref4, _ref5) => {
         allowedTypes: ['image'],
         filesList,
 
-        onFileChange(_ref6) {
-          let [image] = _ref6;
+        onFileChange(_ref7) {
+          let [image] = _ref7;
           editPost({
             featured_media: image.id
           });

package/build/components/post-featured-image/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/editor/src/components/post-featured-image/index.js"],"names":["ALLOWED_MEDIA_TYPES","DEFAULT_FEATURE_IMAGE_LABEL","DEFAULT_SET_FEATURE_IMAGE_LABEL","DEFAULT_REMOVE_FEATURE_IMAGE_LABEL","PostFeaturedImage","currentPostId","featuredImageId","onUpdateImage","onDropImage","onRemoveImage","media","postType","noticeUI","postLabel","instructions","mediaWidth","mediaHeight","mediaSourceUrl","mediaSize","id","media_details","sizes","width","height","source_url","fallbackMediaSize","alt_text","full","file","slug","featured_image","open","set_featured_image","isLoading","remove_featured_image","applyWithSelect","select","getMedia","getPostType","coreStore","getCurrentPostId","getEditedPostAttribute","editorStore","context","applyWithDispatch","dispatch","noticeOperations","editPost","image","featured_media","filesList","blockEditorStore","getSettings","mediaUpload","allowedTypes","onFileChange","onError","message","removeAllNotices","createErrorNotice","withNotices"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { has, get } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { applyFilters } from '@wordpress/hooks';\nimport {\n\tDropZone,\n\tButton,\n\tSpinner,\n\tResponsiveWrapper,\n\twithNotices,\n\twithFilters,\n} from '@wordpress/components';\nimport { compose } from '@wordpress/compose';\nimport { withSelect, withDispatch } from '@wordpress/data';\nimport {\n\tMediaUpload,\n\tMediaUploadCheck,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport PostFeaturedImageCheck from './check';\nimport { store as editorStore } from '../../store';\n\nconst ALLOWED_MEDIA_TYPES = [ 'image' ];\n\n// Used when labels from post type were not yet loaded or when they are not present.\nconst DEFAULT_FEATURE_IMAGE_LABEL = __( 'Featured image' );\nconst DEFAULT_SET_FEATURE_IMAGE_LABEL = __( 'Set featured image' );\nconst DEFAULT_REMOVE_FEATURE_IMAGE_LABEL = __( 'Remove image' );\n\nfunction PostFeaturedImage( {\n\tcurrentPostId,\n\tfeaturedImageId,\n\tonUpdateImage,\n\tonDropImage,\n\tonRemoveImage,\n\tmedia,\n\tpostType,\n\tnoticeUI,\n} ) {\n\tconst postLabel = get( postType, [ 'labels' ], {} );\n\tconst instructions = (\n\t\t<p>\n\t\t\t{ __(\n\t\t\t\t'To edit the featured image, you need permission to upload media.'\n\t\t\t) }\n\t\t</p>\n\t);\n\n\tlet mediaWidth, mediaHeight, mediaSourceUrl;\n\tif ( media ) {\n\t\tconst mediaSize = applyFilters(\n\t\t\t'editor.PostFeaturedImage.imageSize',\n\t\t\t'post-thumbnail',\n\t\t\tmedia.id,\n\t\t\tcurrentPostId\n\t\t);\n\t\tif ( has( media, [ 'media_details', 'sizes', mediaSize ] ) ) {\n\t\t\t// Use mediaSize when available.\n\t\t\tmediaWidth = media.media_details.sizes[ mediaSize ].width;\n\t\t\tmediaHeight = media.media_details.sizes[ mediaSize ].height;\n\t\t\tmediaSourceUrl = media.media_details.sizes[ mediaSize ].source_url;\n\t\t} else {\n\t\t\t// Get fallbackMediaSize if mediaSize is not available.\n\t\t\tconst fallbackMediaSize = applyFilters(\n\t\t\t\t'editor.PostFeaturedImage.imageSize',\n\t\t\t\t'thumbnail',\n\t\t\t\tmedia.id,\n\t\t\t\tcurrentPostId\n\t\t\t);\n\t\t\tif (\n\t\t\t\thas( media, [ 'media_details', 'sizes', fallbackMediaSize ] )\n\t\t\t) {\n\t\t\t\t// Use fallbackMediaSize when mediaSize is not available.\n\t\t\t\tmediaWidth =\n\t\t\t\t\tmedia.media_details.sizes[ fallbackMediaSize ].width;\n\t\t\t\tmediaHeight =\n\t\t\t\t\tmedia.media_details.sizes[ fallbackMediaSize ].height;\n\t\t\t\tmediaSourceUrl =\n\t\t\t\t\tmedia.media_details.sizes[ fallbackMediaSize ].source_url;\n\t\t\t} else {\n\t\t\t\t// Use full image size when mediaFallbackSize and mediaSize are not available.\n\t\t\t\tmediaWidth = media.media_details.width;\n\t\t\t\tmediaHeight = media.media_details.height;\n\t\t\t\tmediaSourceUrl = media.source_url;\n\t\t\t}\n\t\t}\n\t}\n\n\treturn (\n\t\t<PostFeaturedImageCheck>\n\t\t\t{ noticeUI }\n\t\t\t<div className=\"editor-post-featured-image\">\n\t\t\t\t{ media && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tid={ `editor-post-featured-image-${ featuredImageId }-describedby` }\n\t\t\t\t\t\tclassName=\"hidden\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ media.alt_text &&\n\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t// Translators: %s: The selected image alt text.\n\t\t\t\t\t\t\t\t__( 'Current image: %s' ),\n\t\t\t\t\t\t\t\tmedia.alt_text\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ ! media.alt_text &&\n\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t// Translators: %s: The selected image filename.\n\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t'The current image has no alternative text. The file name is: %s'\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\tmedia.media_details.sizes?.full?.file ||\n\t\t\t\t\t\t\t\t\tmedia.slug\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t<MediaUploadCheck fallback={ instructions }>\n\t\t\t\t\t<MediaUpload\n\t\t\t\t\t\ttitle={\n\t\t\t\t\t\t\tpostLabel.featured_image ||\n\t\t\t\t\t\t\tDEFAULT_FEATURE_IMAGE_LABEL\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonSelect={ onUpdateImage }\n\t\t\t\t\t\tunstableFeaturedImageFlow\n\t\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\t\tmodalClass=\"editor-post-featured-image__media-modal\"\n\t\t\t\t\t\trender={ ( { open } ) => (\n\t\t\t\t\t\t\t<div className=\"editor-post-featured-image__container\">\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\t\t\t! featuredImageId\n\t\t\t\t\t\t\t\t\t\t\t? 'editor-post-featured-image__toggle'\n\t\t\t\t\t\t\t\t\t\t\t: 'editor-post-featured-image__preview'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={ open }\n\t\t\t\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\t\t\t\t! featuredImageId\n\t\t\t\t\t\t\t\t\t\t\t? null\n\t\t\t\t\t\t\t\t\t\t\t: __( 'Edit or update the image' )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\taria-describedby={\n\t\t\t\t\t\t\t\t\t\t! featuredImageId\n\t\t\t\t\t\t\t\t\t\t\t? null\n\t\t\t\t\t\t\t\t\t\t\t: `editor-post-featured-image-${ featuredImageId }-describedby`\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{ !! featuredImageId && media && (\n\t\t\t\t\t\t\t\t\t\t<ResponsiveWrapper\n\t\t\t\t\t\t\t\t\t\t\tnaturalWidth={ mediaWidth }\n\t\t\t\t\t\t\t\t\t\t\tnaturalHeight={ mediaHeight }\n\t\t\t\t\t\t\t\t\t\t\tisInline\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\t\tsrc={ mediaSourceUrl }\n\t\t\t\t\t\t\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</ResponsiveWrapper>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ !! featuredImageId && ! media && (\n\t\t\t\t\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ ! featuredImageId &&\n\t\t\t\t\t\t\t\t\t\t( postLabel.set_featured_image ||\n\t\t\t\t\t\t\t\t\t\t\tDEFAULT_SET_FEATURE_IMAGE_LABEL ) }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t<DropZone onFilesDrop={ onDropImage } />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tvalue={ featuredImageId }\n\t\t\t\t\t/>\n\t\t\t\t</MediaUploadCheck>\n\t\t\t\t{ !! featuredImageId && media && ! media.isLoading && (\n\t\t\t\t\t<MediaUploadCheck>\n\t\t\t\t\t\t<MediaUpload\n\t\t\t\t\t\t\ttitle={\n\t\t\t\t\t\t\t\tpostLabel.featured_image ||\n\t\t\t\t\t\t\t\tDEFAULT_FEATURE_IMAGE_LABEL\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonSelect={ onUpdateImage }\n\t\t\t\t\t\t\tunstableFeaturedImageFlow\n\t\t\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\t\t\tmodalClass=\"editor-post-featured-image__media-modal\"\n\t\t\t\t\t\t\trender={ ( { open } ) => (\n\t\t\t\t\t\t\t\t<Button onClick={ open } variant=\"secondary\">\n\t\t\t\t\t\t\t\t\t{ __( 'Replace Image' ) }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</MediaUploadCheck>\n\t\t\t\t) }\n\t\t\t\t{ !! featuredImageId && (\n\t\t\t\t\t<MediaUploadCheck>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tonClick={ onRemoveImage }\n\t\t\t\t\t\t\tvariant=\"link\"\n\t\t\t\t\t\t\tisDestructive\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ postLabel.remove_featured_image ||\n\t\t\t\t\t\t\t\tDEFAULT_REMOVE_FEATURE_IMAGE_LABEL }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</MediaUploadCheck>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</PostFeaturedImageCheck>\n\t);\n}\n\nconst applyWithSelect = withSelect( ( select ) => {\n\tconst { getMedia, getPostType } = select( coreStore );\n\tconst { getCurrentPostId, getEditedPostAttribute } = select( editorStore );\n\tconst featuredImageId = getEditedPostAttribute( 'featured_media' );\n\n\treturn {\n\t\tmedia: featuredImageId\n\t\t\t? getMedia( featuredImageId, { context: 'view' } )\n\t\t\t: null,\n\t\tcurrentPostId: getCurrentPostId(),\n\t\tpostType: getPostType( getEditedPostAttribute( 'type' ) ),\n\t\tfeaturedImageId,\n\t};\n} );\n\nconst applyWithDispatch = withDispatch(\n\t( dispatch, { noticeOperations }, { select } ) => {\n\t\tconst { editPost } = dispatch( editorStore );\n\t\treturn {\n\t\t\tonUpdateImage( image ) {\n\t\t\t\teditPost( { featured_media: image.id } );\n\t\t\t},\n\t\t\tonDropImage( filesList ) {\n\t\t\t\tselect( blockEditorStore )\n\t\t\t\t\t.getSettings()\n\t\t\t\t\t.mediaUpload( {\n\t\t\t\t\t\tallowedTypes: [ 'image' ],\n\t\t\t\t\t\tfilesList,\n\t\t\t\t\t\tonFileChange( [ image ] ) {\n\t\t\t\t\t\t\teditPost( { featured_media: image.id } );\n\t\t\t\t\t\t},\n\t\t\t\t\t\tonError( message ) {\n\t\t\t\t\t\t\tnoticeOperations.removeAllNotices();\n\t\t\t\t\t\t\tnoticeOperations.createErrorNotice( message );\n\t\t\t\t\t\t},\n\t\t\t\t\t} );\n\t\t\t},\n\t\t\tonRemoveImage() {\n\t\t\t\teditPost( { featured_media: 0 } );\n\t\t\t},\n\t\t};\n\t}\n);\n\nexport default compose(\n\twithNotices,\n\tapplyWithSelect,\n\tapplyWithDispatch,\n\twithFilters( 'editor.PostFeaturedImage' )\n)( PostFeaturedImage );\n"]}
+{"version":3,"sources":["@wordpress/editor/src/components/post-featured-image/index.js"],"names":["ALLOWED_MEDIA_TYPES","DEFAULT_FEATURE_IMAGE_LABEL","DEFAULT_SET_FEATURE_IMAGE_LABEL","DEFAULT_REMOVE_FEATURE_IMAGE_LABEL","instructions","getMediaDetails","media","postId","defaultSize","id","mediaWidth","media_details","sizes","width","mediaHeight","height","mediaSourceUrl","source_url","fallbackSize","PostFeaturedImage","currentPostId","featuredImageId","onUpdateImage","onRemoveImage","postType","noticeUI","noticeOperations","isLoading","setIsLoading","mediaUpload","select","blockEditorStore","getSettings","postLabel","onDropFiles","filesList","allowedTypes","onFileChange","image","url","onError","message","removeAllNotices","createErrorNotice","alt_text","full","file","slug","featured_image","open","set_featured_image","remove_featured_image","applyWithSelect","getMedia","getPostType","coreStore","getCurrentPostId","getEditedPostAttribute","editorStore","context","applyWithDispatch","dispatch","editPost","featured_media","onDropImage","withNotices"],"mappings":";;;;;;;;;AAmBA;;AAhBA;;AAKA;;AACA;;AACA;;AAQA;;AAEA;;AACA;;AACA;;AAKA;;AAKA;;AACA;;AAjCA;AACA;AACA;;AAGA;AACA;AACA;;AAsBA;AACA;AACA;AAIA,MAAMA,mBAAmB,GAAG,CAAE,OAAF,CAA5B,C,CAEA;;AACA,MAAMC,2BAA2B,GAAG,cAAI,gBAAJ,CAApC;AACA,MAAMC,+BAA+B,GAAG,cAAI,oBAAJ,CAAxC;AACA,MAAMC,kCAAkC,GAAG,cAAI,cAAJ,CAA3C;AAEA,MAAMC,YAAY,GACjB,uCACG,cACD,kEADC,CADH,CADD;;AAQA,SAASC,eAAT,CAA0BC,KAA1B,EAAiCC,MAAjC,EAA0C;AACzC,MAAK,CAAED,KAAP,EAAe;AACd,WAAO,EAAP;AACA;;AAED,QAAME,WAAW,GAAG,yBACnB,oCADmB,EAEnB,OAFmB,EAGnBF,KAAK,CAACG,EAHa,EAInBF,MAJmB,CAApB;;AAMA,MAAK,iBAAKD,KAAL,EAAY,CAAE,eAAF,EAAmB,OAAnB,EAA4BE,WAA5B,CAAZ,CAAL,EAA+D;AAC9D,WAAO;AACNE,MAAAA,UAAU,EAAEJ,KAAK,CAACK,aAAN,CAAoBC,KAApB,CAA2BJ,WAA3B,EAAyCK,KAD/C;AAENC,MAAAA,WAAW,EAAER,KAAK,CAACK,aAAN,CAAoBC,KAApB,CAA2BJ,WAA3B,EAAyCO,MAFhD;AAGNC,MAAAA,cAAc,EAAEV,KAAK,CAACK,aAAN,CAAoBC,KAApB,CAA2BJ,WAA3B,EAAyCS;AAHnD,KAAP;AAKA,GAjBwC,CAmBzC;;;AACA,QAAMC,YAAY,GAAG,yBACpB,oCADoB,EAEpB,WAFoB,EAGpBZ,KAAK,CAACG,EAHc,EAIpBF,MAJoB,CAArB;;AAMA,MAAK,iBAAKD,KAAL,EAAY,CAAE,eAAF,EAAmB,OAAnB,EAA4BY,YAA5B,CAAZ,CAAL,EAAgE;AAC/D,WAAO;AACNR,MAAAA,UAAU,EAAEJ,KAAK,CAACK,aAAN,CAAoBC,KAApB,CAA2BM,YAA3B,EAA0CL,KADhD;AAENC,MAAAA,WAAW,EAAER,KAAK,CAACK,aAAN,CAAoBC,KAApB,CAA2BM,YAA3B,EAA0CH,MAFjD;AAGNC,MAAAA,cAAc,EACbV,KAAK,CAACK,aAAN,CAAoBC,KAApB,CAA2BM,YAA3B,EAA0CD;AAJrC,KAAP;AAMA,GAjCwC,CAmCzC;;;AACA,SAAO;AACNP,IAAAA,UAAU,EAAEJ,KAAK,CAACK,aAAN,CAAoBE,KAD1B;AAENC,IAAAA,WAAW,EAAER,KAAK,CAACK,aAAN,CAAoBI,MAF3B;AAGNC,IAAAA,cAAc,EAAEV,KAAK,CAACW;AAHhB,GAAP;AAKA;;AAED,SAASE,iBAAT,OASI;AAAA;;AAAA,MATwB;AAC3BC,IAAAA,aAD2B;AAE3BC,IAAAA,eAF2B;AAG3BC,IAAAA,aAH2B;AAI3BC,IAAAA,aAJ2B;AAK3BjB,IAAAA,KAL2B;AAM3BkB,IAAAA,QAN2B;AAO3BC,IAAAA,QAP2B;AAQ3BC,IAAAA;AAR2B,GASxB;AACH,QAAM,CAAEC,SAAF,EAAaC,YAAb,IAA8B,uBAAU,KAAV,CAApC;AACA,QAAMC,WAAW,GAAG,qBAAaC,MAAF,IAAc;AAC5C,WAAOA,MAAM,CAAEC,kBAAF,CAAN,CAA2BC,WAA3B,GAAyCH,WAAhD;AACA,GAFmB,EAEjB,EAFiB,CAApB;AAGA,QAAMI,SAAS,GAAG,iBAAKT,QAAL,EAAe,CAAE,QAAF,CAAf,EAA6B,EAA7B,CAAlB;AACA,QAAM;AAAEd,IAAAA,UAAF;AAAcI,IAAAA,WAAd;AAA2BE,IAAAA;AAA3B,MAA8CX,eAAe,CAClEC,KADkE,EAElEc,aAFkE,CAAnE;;AAKA,WAASc,WAAT,CAAsBC,SAAtB,EAAkC;AACjCN,IAAAA,WAAW,CAAE;AACZO,MAAAA,YAAY,EAAE,CAAE,OAAF,CADF;AAEZD,MAAAA,SAFY;;AAGZE,MAAAA,YAAY,QAAc;AAAA,YAAZ,CAAEC,KAAF,CAAY;;AACzB,YAAK,qBAAWA,KAAX,aAAWA,KAAX,uBAAWA,KAAK,CAAEC,GAAlB,CAAL,EAA+B;AAC9BX,UAAAA,YAAY,CAAE,IAAF,CAAZ;AACA;AACA;;AACDN,QAAAA,aAAa,CAAEgB,KAAF,CAAb;AACAV,QAAAA,YAAY,CAAE,KAAF,CAAZ;AACA,OAVW;;AAWZY,MAAAA,OAAO,CAAEC,OAAF,EAAY;AAClBf,QAAAA,gBAAgB,CAACgB,gBAAjB;AACAhB,QAAAA,gBAAgB,CAACiB,iBAAjB,CAAoCF,OAApC;AACA;;AAdW,KAAF,CAAX;AAgBA;;AAED,SACC,4BAAC,cAAD,QACGhB,QADH,EAEC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGnB,KAAK,IACN;AACC,IAAA,EAAE,EAAI,8BAA8Be,eAAiB,cADtD;AAEC,IAAA,SAAS,EAAC;AAFX,KAIGf,KAAK,CAACsC,QAAN,IACD,oBACC;AACA,gBAAI,mBAAJ,CAFD,EAGCtC,KAAK,CAACsC,QAHP,CALF,EAUG,CAAEtC,KAAK,CAACsC,QAAR,IACD,oBACC;AACA,gBACC,iEADD,CAFD,EAKC,0BAAAtC,KAAK,CAACK,aAAN,CAAoBC,KAApB,0GAA2BiC,IAA3B,kFAAiCC,IAAjC,KACCxC,KAAK,CAACyC,IANR,CAXF,CAFF,EAuBC,4BAAC,6BAAD;AAAkB,IAAA,QAAQ,EAAG3C;AAA7B,KACC,4BAAC,wBAAD;AACC,IAAA,KAAK,EACJ6B,SAAS,CAACe,cAAV,IACA/C,2BAHF;AAKC,IAAA,QAAQ,EAAGqB,aALZ;AAMC,IAAA,yBAAyB,MAN1B;AAOC,IAAA,YAAY,EAAGtB,mBAPhB;AAQC,IAAA,UAAU,EAAC,yCARZ;AASC,IAAA,MAAM,EAAG;AAAA,UAAE;AAAEiD,QAAAA;AAAF,OAAF;AAAA,aACR;AAAK,QAAA,SAAS,EAAC;AAAf,SACC,4BAAC,kBAAD;AACC,QAAA,SAAS,EACR,CAAE5B,eAAF,GACG,oCADH,GAEG,qCAJL;AAMC,QAAA,OAAO,EAAG4B,IANX;AAOC,sBACC,CAAE5B,eAAF,GACG,IADH,GAEG,cAAI,0BAAJ,CAVL;AAYC,4BACC,CAAEA,eAAF,GACG,IADH,GAEI,8BAA8BA,eAAiB;AAfrD,SAkBG,CAAC,CAAEA,eAAH,IAAsBf,KAAtB,IACD,4BAAC,6BAAD;AACC,QAAA,YAAY,EAAGI,UADhB;AAEC,QAAA,aAAa,EAAGI,WAFjB;AAGC,QAAA,QAAQ;AAHT,SAKC;AACC,QAAA,GAAG,EAAGE,cADP;AAEC,QAAA,GAAG,EAAC;AAFL,QALD,CAnBF,EA8BGW,SAAS,IAAI,4BAAC,mBAAD,OA9BhB,EA+BG,CAAEN,eAAF,IACD,CAAEM,SADD,KAECM,SAAS,CAACiB,kBAAV,IACDhD,+BAHA,CA/BH,CADD,EAqCC,4BAAC,oBAAD;AAAU,QAAA,WAAW,EAAGgC;AAAxB,QArCD,CADQ;AAAA,KATV;AAkDC,IAAA,KAAK,EAAGb;AAlDT,IADD,CAvBD,EA6EG,CAAC,CAAEA,eAAH,IACD,4BAAC,6BAAD,QACGf,KAAK,IACN,4BAAC,wBAAD;AACC,IAAA,KAAK,EACJ2B,SAAS,CAACe,cAAV,IACA/C,2BAHF;AAKC,IAAA,QAAQ,EAAGqB,aALZ;AAMC,IAAA,yBAAyB,MAN1B;AAOC,IAAA,YAAY,EAAGtB,mBAPhB;AAQC,IAAA,UAAU,EAAC,yCARZ;AASC,IAAA,MAAM,EAAG;AAAA,UAAE;AAAEiD,QAAAA;AAAF,OAAF;AAAA,aACR,4BAAC,kBAAD;AACC,QAAA,OAAO,EAAGA,IADX;AAEC,QAAA,OAAO,EAAC;AAFT,SAIG,cAAI,eAAJ,CAJH,CADQ;AAAA;AATV,IAFF,EAqBC,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAG1B,aADX;AAEC,IAAA,OAAO,EAAC,MAFT;AAGC,IAAA,aAAa;AAHd,KAKGU,SAAS,CAACkB,qBAAV,IACDhD,kCANF,CArBD,CA9EF,CAFD,CADD;AAmHA;;AAED,MAAMiD,eAAe,GAAG,sBAActB,MAAF,IAAc;AACjD,QAAM;AAAEuB,IAAAA,QAAF;AAAYC,IAAAA;AAAZ,MAA4BxB,MAAM,CAAEyB,eAAF,CAAxC;AACA,QAAM;AAAEC,IAAAA,gBAAF;AAAoBC,IAAAA;AAApB,MAA+C3B,MAAM,CAAE4B,YAAF,CAA3D;AACA,QAAMrC,eAAe,GAAGoC,sBAAsB,CAAE,gBAAF,CAA9C;AAEA,SAAO;AACNnD,IAAAA,KAAK,EAAEe,eAAe,GACnBgC,QAAQ,CAAEhC,eAAF,EAAmB;AAAEsC,MAAAA,OAAO,EAAE;AAAX,KAAnB,CADW,GAEnB,IAHG;AAINvC,IAAAA,aAAa,EAAEoC,gBAAgB,EAJzB;AAKNhC,IAAAA,QAAQ,EAAE8B,WAAW,CAAEG,sBAAsB,CAAE,MAAF,CAAxB,CALf;AAMNpC,IAAAA;AANM,GAAP;AAQA,CAbuB,CAAxB;AAeA,MAAMuC,iBAAiB,GAAG,wBACzB,CAAEC,QAAF,mBAAkD;AAAA,MAAtC;AAAEnC,IAAAA;AAAF,GAAsC;AAAA,MAAhB;AAAEI,IAAAA;AAAF,GAAgB;AACjD,QAAM;AAAEgC,IAAAA;AAAF,MAAeD,QAAQ,CAAEH,YAAF,CAA7B;AACA,SAAO;AACNpC,IAAAA,aAAa,CAAEgB,KAAF,EAAU;AACtBwB,MAAAA,QAAQ,CAAE;AAAEC,QAAAA,cAAc,EAAEzB,KAAK,CAAC7B;AAAxB,OAAF,CAAR;AACA,KAHK;;AAINuD,IAAAA,WAAW,CAAE7B,SAAF,EAAc;AACxBL,MAAAA,MAAM,CAAEC,kBAAF,CAAN,CACEC,WADF,GAEEH,WAFF,CAEe;AACbO,QAAAA,YAAY,EAAE,CAAE,OAAF,CADD;AAEbD,QAAAA,SAFa;;AAGbE,QAAAA,YAAY,QAAc;AAAA,cAAZ,CAAEC,KAAF,CAAY;AACzBwB,UAAAA,QAAQ,CAAE;AAAEC,YAAAA,cAAc,EAAEzB,KAAK,CAAC7B;AAAxB,WAAF,CAAR;AACA,SALY;;AAMb+B,QAAAA,OAAO,CAAEC,OAAF,EAAY;AAClBf,UAAAA,gBAAgB,CAACgB,gBAAjB;AACAhB,UAAAA,gBAAgB,CAACiB,iBAAjB,CAAoCF,OAApC;AACA;;AATY,OAFf;AAaA,KAlBK;;AAmBNlB,IAAAA,aAAa,GAAG;AACfuC,MAAAA,QAAQ,CAAE;AAAEC,QAAAA,cAAc,EAAE;AAAlB,OAAF,CAAR;AACA;;AArBK,GAAP;AAuBA,CA1BwB,CAA1B;;eA6Be,sBACdE,uBADc,EAEdb,eAFc,EAGdQ,iBAHc,EAId,6BAAa,0BAAb,CAJc,EAKZzC,iBALY,C","sourcesContent":["/**\n * External dependencies\n */\nimport { has, get } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { applyFilters } from '@wordpress/hooks';\nimport {\n\tDropZone,\n\tButton,\n\tSpinner,\n\tResponsiveWrapper,\n\twithNotices,\n\twithFilters,\n} from '@wordpress/components';\nimport { isBlobURL } from '@wordpress/blob';\nimport { useState } from '@wordpress/element';\nimport { compose } from '@wordpress/compose';\nimport { useSelect, withDispatch, withSelect } from '@wordpress/data';\nimport {\n\tMediaUpload,\n\tMediaUploadCheck,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport PostFeaturedImageCheck from './check';\nimport { store as editorStore } from '../../store';\n\nconst ALLOWED_MEDIA_TYPES = [ 'image' ];\n\n// Used when labels from post type were not yet loaded or when they are not present.\nconst DEFAULT_FEATURE_IMAGE_LABEL = __( 'Featured image' );\nconst DEFAULT_SET_FEATURE_IMAGE_LABEL = __( 'Set featured image' );\nconst DEFAULT_REMOVE_FEATURE_IMAGE_LABEL = __( 'Remove image' );\n\nconst instructions = (\n\t<p>\n\t\t{ __(\n\t\t\t'To edit the featured image, you need permission to upload media.'\n\t\t) }\n\t</p>\n);\n\nfunction getMediaDetails( media, postId ) {\n\tif ( ! media ) {\n\t\treturn {};\n\t}\n\n\tconst defaultSize = applyFilters(\n\t\t'editor.PostFeaturedImage.imageSize',\n\t\t'large',\n\t\tmedia.id,\n\t\tpostId\n\t);\n\tif ( has( media, [ 'media_details', 'sizes', defaultSize ] ) ) {\n\t\treturn {\n\t\t\tmediaWidth: media.media_details.sizes[ defaultSize ].width,\n\t\t\tmediaHeight: media.media_details.sizes[ defaultSize ].height,\n\t\t\tmediaSourceUrl: media.media_details.sizes[ defaultSize ].source_url,\n\t\t};\n\t}\n\n\t// Use fallbackSize when defaultSize is not available.\n\tconst fallbackSize = applyFilters(\n\t\t'editor.PostFeaturedImage.imageSize',\n\t\t'thumbnail',\n\t\tmedia.id,\n\t\tpostId\n\t);\n\tif ( has( media, [ 'media_details', 'sizes', fallbackSize ] ) ) {\n\t\treturn {\n\t\t\tmediaWidth: media.media_details.sizes[ fallbackSize ].width,\n\t\t\tmediaHeight: media.media_details.sizes[ fallbackSize ].height,\n\t\t\tmediaSourceUrl:\n\t\t\t\tmedia.media_details.sizes[ fallbackSize ].source_url,\n\t\t};\n\t}\n\n\t// Use full image size when fallbackSize and defaultSize are not available.\n\treturn {\n\t\tmediaWidth: media.media_details.width,\n\t\tmediaHeight: media.media_details.height,\n\t\tmediaSourceUrl: media.source_url,\n\t};\n}\n\nfunction PostFeaturedImage( {\n\tcurrentPostId,\n\tfeaturedImageId,\n\tonUpdateImage,\n\tonRemoveImage,\n\tmedia,\n\tpostType,\n\tnoticeUI,\n\tnoticeOperations,\n} ) {\n\tconst [ isLoading, setIsLoading ] = useState( false );\n\tconst mediaUpload = useSelect( ( select ) => {\n\t\treturn select( blockEditorStore ).getSettings().mediaUpload;\n\t}, [] );\n\tconst postLabel = get( postType, [ 'labels' ], {} );\n\tconst { mediaWidth, mediaHeight, mediaSourceUrl } = getMediaDetails(\n\t\tmedia,\n\t\tcurrentPostId\n\t);\n\n\tfunction onDropFiles( filesList ) {\n\t\tmediaUpload( {\n\t\t\tallowedTypes: [ 'image' ],\n\t\t\tfilesList,\n\t\t\tonFileChange( [ image ] ) {\n\t\t\t\tif ( isBlobURL( image?.url ) ) {\n\t\t\t\t\tsetIsLoading( true );\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tonUpdateImage( image );\n\t\t\t\tsetIsLoading( false );\n\t\t\t},\n\t\t\tonError( message ) {\n\t\t\t\tnoticeOperations.removeAllNotices();\n\t\t\t\tnoticeOperations.createErrorNotice( message );\n\t\t\t},\n\t\t} );\n\t}\n\n\treturn (\n\t\t<PostFeaturedImageCheck>\n\t\t\t{ noticeUI }\n\t\t\t<div className=\"editor-post-featured-image\">\n\t\t\t\t{ media && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tid={ `editor-post-featured-image-${ featuredImageId }-describedby` }\n\t\t\t\t\t\tclassName=\"hidden\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ media.alt_text &&\n\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t// Translators: %s: The selected image alt text.\n\t\t\t\t\t\t\t\t__( 'Current image: %s' ),\n\t\t\t\t\t\t\t\tmedia.alt_text\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ ! media.alt_text &&\n\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t// Translators: %s: The selected image filename.\n\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t'The current image has no alternative text. The file name is: %s'\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\tmedia.media_details.sizes?.full?.file ||\n\t\t\t\t\t\t\t\t\tmedia.slug\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t<MediaUploadCheck fallback={ instructions }>\n\t\t\t\t\t<MediaUpload\n\t\t\t\t\t\ttitle={\n\t\t\t\t\t\t\tpostLabel.featured_image ||\n\t\t\t\t\t\t\tDEFAULT_FEATURE_IMAGE_LABEL\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonSelect={ onUpdateImage }\n\t\t\t\t\t\tunstableFeaturedImageFlow\n\t\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\t\tmodalClass=\"editor-post-featured-image__media-modal\"\n\t\t\t\t\t\trender={ ( { open } ) => (\n\t\t\t\t\t\t\t<div className=\"editor-post-featured-image__container\">\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName={\n\t\t\t\t\t\t\t\t\t\t! featuredImageId\n\t\t\t\t\t\t\t\t\t\t\t? 'editor-post-featured-image__toggle'\n\t\t\t\t\t\t\t\t\t\t\t: 'editor-post-featured-image__preview'\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={ open }\n\t\t\t\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\t\t\t\t! featuredImageId\n\t\t\t\t\t\t\t\t\t\t\t? null\n\t\t\t\t\t\t\t\t\t\t\t: __( 'Edit or update the image' )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\taria-describedby={\n\t\t\t\t\t\t\t\t\t\t! featuredImageId\n\t\t\t\t\t\t\t\t\t\t\t? null\n\t\t\t\t\t\t\t\t\t\t\t: `editor-post-featured-image-${ featuredImageId }-describedby`\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{ !! featuredImageId && media && (\n\t\t\t\t\t\t\t\t\t\t<ResponsiveWrapper\n\t\t\t\t\t\t\t\t\t\t\tnaturalWidth={ mediaWidth }\n\t\t\t\t\t\t\t\t\t\t\tnaturalHeight={ mediaHeight }\n\t\t\t\t\t\t\t\t\t\t\tisInline\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\t\tsrc={ mediaSourceUrl }\n\t\t\t\t\t\t\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</ResponsiveWrapper>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ isLoading && <Spinner /> }\n\t\t\t\t\t\t\t\t\t{ ! featuredImageId &&\n\t\t\t\t\t\t\t\t\t\t! isLoading &&\n\t\t\t\t\t\t\t\t\t\t( postLabel.set_featured_image ||\n\t\t\t\t\t\t\t\t\t\t\tDEFAULT_SET_FEATURE_IMAGE_LABEL ) }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t<DropZone onFilesDrop={ onDropFiles } />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tvalue={ featuredImageId }\n\t\t\t\t\t/>\n\t\t\t\t</MediaUploadCheck>\n\t\t\t\t{ !! featuredImageId && (\n\t\t\t\t\t<MediaUploadCheck>\n\t\t\t\t\t\t{ media && (\n\t\t\t\t\t\t\t<MediaUpload\n\t\t\t\t\t\t\t\ttitle={\n\t\t\t\t\t\t\t\t\tpostLabel.featured_image ||\n\t\t\t\t\t\t\t\t\tDEFAULT_FEATURE_IMAGE_LABEL\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonSelect={ onUpdateImage }\n\t\t\t\t\t\t\t\tunstableFeaturedImageFlow\n\t\t\t\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\t\t\t\tmodalClass=\"editor-post-featured-image__media-modal\"\n\t\t\t\t\t\t\t\trender={ ( { open } ) => (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tonClick={ open }\n\t\t\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Replace Image' ) }\n\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tonClick={ onRemoveImage }\n\t\t\t\t\t\t\tvariant=\"link\"\n\t\t\t\t\t\t\tisDestructive\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ postLabel.remove_featured_image ||\n\t\t\t\t\t\t\t\tDEFAULT_REMOVE_FEATURE_IMAGE_LABEL }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</MediaUploadCheck>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</PostFeaturedImageCheck>\n\t);\n}\n\nconst applyWithSelect = withSelect( ( select ) => {\n\tconst { getMedia, getPostType } = select( coreStore );\n\tconst { getCurrentPostId, getEditedPostAttribute } = select( editorStore );\n\tconst featuredImageId = getEditedPostAttribute( 'featured_media' );\n\n\treturn {\n\t\tmedia: featuredImageId\n\t\t\t? getMedia( featuredImageId, { context: 'view' } )\n\t\t\t: null,\n\t\tcurrentPostId: getCurrentPostId(),\n\t\tpostType: getPostType( getEditedPostAttribute( 'type' ) ),\n\t\tfeaturedImageId,\n\t};\n} );\n\nconst applyWithDispatch = withDispatch(\n\t( dispatch, { noticeOperations }, { select } ) => {\n\t\tconst { editPost } = dispatch( editorStore );\n\t\treturn {\n\t\t\tonUpdateImage( image ) {\n\t\t\t\teditPost( { featured_media: image.id } );\n\t\t\t},\n\t\t\tonDropImage( filesList ) {\n\t\t\t\tselect( blockEditorStore )\n\t\t\t\t\t.getSettings()\n\t\t\t\t\t.mediaUpload( {\n\t\t\t\t\t\tallowedTypes: [ 'image' ],\n\t\t\t\t\t\tfilesList,\n\t\t\t\t\t\tonFileChange( [ image ] ) {\n\t\t\t\t\t\t\teditPost( { featured_media: image.id } );\n\t\t\t\t\t\t},\n\t\t\t\t\t\tonError( message ) {\n\t\t\t\t\t\t\tnoticeOperations.removeAllNotices();\n\t\t\t\t\t\t\tnoticeOperations.createErrorNotice( message );\n\t\t\t\t\t\t},\n\t\t\t\t\t} );\n\t\t\t},\n\t\t\tonRemoveImage() {\n\t\t\t\teditPost( { featured_media: 0 } );\n\t\t\t},\n\t\t};\n\t}\n);\n\nexport default compose(\n\twithNotices,\n\tapplyWithSelect,\n\tapplyWithDispatch,\n\twithFilters( 'editor.PostFeaturedImage' )\n)( PostFeaturedImage );\n"]}