@wordpress/edit-post 7.25.0 → 7.26.0

package/src/components/preferences-modal/test/__snapshots__/meta-boxes-section.js.snap

@@ -65,42 +65,46 @@ exports[`MetaBoxesSection renders a Custom Fields option 1`] = `
     </h2>
   </legend>
   <div
-    class="interface-preferences-modal__option"
+    class="interface-preferences-modal__section-content"
   >
     <div
-      class="components-base-control components-toggle-control emotion-0 emotion-1"
+      class="interface-preferences-modal__option"
     >
       <div
-        class="components-base-control__field emotion-2 emotion-3"
+        class="components-base-control components-toggle-control emotion-0 emotion-1"
       >
         <div
-          class="components-flex components-h-stack emotion-4 emotion-5"
-          data-wp-c16t="true"
-          data-wp-component="HStack"
+          class="components-base-control__field emotion-2 emotion-3"
         >
-          <span
-            class="components-form-toggle"
-          >
-            <input
-              class="components-form-toggle__input"
-              id="inspector-toggle-control-0"
-              type="checkbox"
-            />
-            <span
-              class="components-form-toggle__track"
-            />
-            <span
-              class="components-form-toggle__thumb"
-            />
-          </span>
-          <label
-            class="components-flex-item components-flex-block components-toggle-control__label emotion-6 emotion-5"
+          <div
+            class="components-flex components-h-stack emotion-4 emotion-5"
             data-wp-c16t="true"
-            data-wp-component="FlexBlock"
-            for="inspector-toggle-control-0"
+            data-wp-component="HStack"
           >
-            Custom fields
-          </label>
+            <span
+              class="components-form-toggle"
+            >
+              <input
+                class="components-form-toggle__input"
+                id="inspector-toggle-control-0"
+                type="checkbox"
+              />
+              <span
+                class="components-form-toggle__track"
+              />
+              <span
+                class="components-form-toggle__thumb"
+              />
+            </span>
+            <label
+              class="components-flex-item components-flex-block components-toggle-control__label emotion-6 emotion-5"
+              data-wp-c16t="true"
+              data-wp-component="FlexBlock"
+              for="inspector-toggle-control-0"
+            >
+              Custom fields
+            </label>
+          </div>
         </div>
       </div>
     </div>
@@ -173,126 +177,130 @@ exports[`MetaBoxesSection renders a Custom Fields option and meta box options 1`
     </h2>
   </legend>
   <div
-    class="interface-preferences-modal__option"
+    class="interface-preferences-modal__section-content"
   >
     <div
-      class="components-base-control components-toggle-control emotion-0 emotion-1"
+      class="interface-preferences-modal__option"
     >
       <div
-        class="components-base-control__field emotion-2 emotion-3"
+        class="components-base-control components-toggle-control emotion-0 emotion-1"
       >
         <div
-          class="components-flex components-h-stack emotion-4 emotion-5"
-          data-wp-c16t="true"
-          data-wp-component="HStack"
+          class="components-base-control__field emotion-2 emotion-3"
         >
-          <span
-            class="components-form-toggle"
-          >
-            <input
-              class="components-form-toggle__input"
-              id="inspector-toggle-control-3"
-              type="checkbox"
-            />
-            <span
-              class="components-form-toggle__track"
-            />
-            <span
-              class="components-form-toggle__thumb"
-            />
-          </span>
-          <label
-            class="components-flex-item components-flex-block components-toggle-control__label emotion-6 emotion-5"
+          <div
+            class="components-flex components-h-stack emotion-4 emotion-5"
             data-wp-c16t="true"
-            data-wp-component="FlexBlock"
-            for="inspector-toggle-control-3"
+            data-wp-component="HStack"
           >
-            Custom fields
-          </label>
+            <span
+              class="components-form-toggle"
+            >
+              <input
+                class="components-form-toggle__input"
+                id="inspector-toggle-control-3"
+                type="checkbox"
+              />
+              <span
+                class="components-form-toggle__track"
+              />
+              <span
+                class="components-form-toggle__thumb"
+              />
+            </span>
+            <label
+              class="components-flex-item components-flex-block components-toggle-control__label emotion-6 emotion-5"
+              data-wp-c16t="true"
+              data-wp-component="FlexBlock"
+              for="inspector-toggle-control-3"
+            >
+              Custom fields
+            </label>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    class="interface-preferences-modal__option"
-  >
     <div
-      class="components-base-control components-toggle-control emotion-0 emotion-1"
+      class="interface-preferences-modal__option"
     >
       <div
-        class="components-base-control__field emotion-2 emotion-3"
+        class="components-base-control components-toggle-control emotion-0 emotion-1"
       >
         <div
-          class="components-flex components-h-stack emotion-4 emotion-5"
-          data-wp-c16t="true"
-          data-wp-component="HStack"
+          class="components-base-control__field emotion-2 emotion-3"
         >
-          <span
-            class="components-form-toggle is-checked"
-          >
-            <input
-              checked=""
-              class="components-form-toggle__input"
-              id="inspector-toggle-control-4"
-              type="checkbox"
-            />
-            <span
-              class="components-form-toggle__track"
-            />
-            <span
-              class="components-form-toggle__thumb"
-            />
-          </span>
-          <label
-            class="components-flex-item components-flex-block components-toggle-control__label emotion-6 emotion-5"
+          <div
+            class="components-flex components-h-stack emotion-4 emotion-5"
             data-wp-c16t="true"
-            data-wp-component="FlexBlock"
-            for="inspector-toggle-control-4"
+            data-wp-component="HStack"
           >
-            Meta Box 1
-          </label>
+            <span
+              class="components-form-toggle is-checked"
+            >
+              <input
+                checked=""
+                class="components-form-toggle__input"
+                id="inspector-toggle-control-4"
+                type="checkbox"
+              />
+              <span
+                class="components-form-toggle__track"
+              />
+              <span
+                class="components-form-toggle__thumb"
+              />
+            </span>
+            <label
+              class="components-flex-item components-flex-block components-toggle-control__label emotion-6 emotion-5"
+              data-wp-c16t="true"
+              data-wp-component="FlexBlock"
+              for="inspector-toggle-control-4"
+            >
+              Meta Box 1
+            </label>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    class="interface-preferences-modal__option"
-  >
     <div
-      class="components-base-control components-toggle-control emotion-0 emotion-1"
+      class="interface-preferences-modal__option"
     >
       <div
-        class="components-base-control__field emotion-2 emotion-3"
+        class="components-base-control components-toggle-control emotion-0 emotion-1"
       >
         <div
-          class="components-flex components-h-stack emotion-4 emotion-5"
-          data-wp-c16t="true"
-          data-wp-component="HStack"
+          class="components-base-control__field emotion-2 emotion-3"
         >
-          <span
-            class="components-form-toggle is-checked"
-          >
-            <input
-              checked=""
-              class="components-form-toggle__input"
-              id="inspector-toggle-control-5"
-              type="checkbox"
-            />
-            <span
-              class="components-form-toggle__track"
-            />
-            <span
-              class="components-form-toggle__thumb"
-            />
-          </span>
-          <label
-            class="components-flex-item components-flex-block components-toggle-control__label emotion-6 emotion-5"
+          <div
+            class="components-flex components-h-stack emotion-4 emotion-5"
             data-wp-c16t="true"
-            data-wp-component="FlexBlock"
-            for="inspector-toggle-control-5"
+            data-wp-component="HStack"
           >
-            Meta Box 2
-          </label>
+            <span
+              class="components-form-toggle is-checked"
+            >
+              <input
+                checked=""
+                class="components-form-toggle__input"
+                id="inspector-toggle-control-5"
+                type="checkbox"
+              />
+              <span
+                class="components-form-toggle__track"
+              />
+              <span
+                class="components-form-toggle__thumb"
+              />
+            </span>
+            <label
+              class="components-flex-item components-flex-block components-toggle-control__label emotion-6 emotion-5"
+              data-wp-c16t="true"
+              data-wp-component="FlexBlock"
+              for="inspector-toggle-control-5"
+            >
+              Meta Box 2
+            </label>
+          </div>
         </div>
       </div>
     </div>
@@ -365,85 +373,89 @@ exports[`MetaBoxesSection renders meta box options 1`] = `
     </h2>
   </legend>
   <div
-    class="interface-preferences-modal__option"
+    class="interface-preferences-modal__section-content"
   >
     <div
-      class="components-base-control components-toggle-control emotion-0 emotion-1"
+      class="interface-preferences-modal__option"
     >
       <div
-        class="components-base-control__field emotion-2 emotion-3"
+        class="components-base-control components-toggle-control emotion-0 emotion-1"
       >
         <div
-          class="components-flex components-h-stack emotion-4 emotion-5"
-          data-wp-c16t="true"
-          data-wp-component="HStack"
+          class="components-base-control__field emotion-2 emotion-3"
         >
-          <span
-            class="components-form-toggle is-checked"
-          >
-            <input
-              checked=""
-              class="components-form-toggle__input"
-              id="inspector-toggle-control-1"
-              type="checkbox"
-            />
-            <span
-              class="components-form-toggle__track"
-            />
-            <span
-              class="components-form-toggle__thumb"
-            />
-          </span>
-          <label
-            class="components-flex-item components-flex-block components-toggle-control__label emotion-6 emotion-5"
+          <div
+            class="components-flex components-h-stack emotion-4 emotion-5"
             data-wp-c16t="true"
-            data-wp-component="FlexBlock"
-            for="inspector-toggle-control-1"
+            data-wp-component="HStack"
           >
-            Meta Box 1
-          </label>
+            <span
+              class="components-form-toggle is-checked"
+            >
+              <input
+                checked=""
+                class="components-form-toggle__input"
+                id="inspector-toggle-control-1"
+                type="checkbox"
+              />
+              <span
+                class="components-form-toggle__track"
+              />
+              <span
+                class="components-form-toggle__thumb"
+              />
+            </span>
+            <label
+              class="components-flex-item components-flex-block components-toggle-control__label emotion-6 emotion-5"
+              data-wp-c16t="true"
+              data-wp-component="FlexBlock"
+              for="inspector-toggle-control-1"
+            >
+              Meta Box 1
+            </label>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    class="interface-preferences-modal__option"
-  >
     <div
-      class="components-base-control components-toggle-control emotion-0 emotion-1"
+      class="interface-preferences-modal__option"
     >
       <div
-        class="components-base-control__field emotion-2 emotion-3"
+        class="components-base-control components-toggle-control emotion-0 emotion-1"
       >
         <div
-          class="components-flex components-h-stack emotion-4 emotion-5"
-          data-wp-c16t="true"
-          data-wp-component="HStack"
+          class="components-base-control__field emotion-2 emotion-3"
         >
-          <span
-            class="components-form-toggle is-checked"
-          >
-            <input
-              checked=""
-              class="components-form-toggle__input"
-              id="inspector-toggle-control-2"
-              type="checkbox"
-            />
-            <span
-              class="components-form-toggle__track"
-            />
-            <span
-              class="components-form-toggle__thumb"
-            />
-          </span>
-          <label
-            class="components-flex-item components-flex-block components-toggle-control__label emotion-6 emotion-5"
+          <div
+            class="components-flex components-h-stack emotion-4 emotion-5"
             data-wp-c16t="true"
-            data-wp-component="FlexBlock"
-            for="inspector-toggle-control-2"
+            data-wp-component="HStack"
           >
-            Meta Box 2
-          </label>
+            <span
+              class="components-form-toggle is-checked"
+            >
+              <input
+                checked=""
+                class="components-form-toggle__input"
+                id="inspector-toggle-control-2"
+                type="checkbox"
+              />
+              <span
+                class="components-form-toggle__track"
+              />
+              <span
+                class="components-form-toggle__thumb"
+              />
+            </span>
+            <label
+              class="components-flex-item components-flex-block components-toggle-control__label emotion-6 emotion-5"
+              data-wp-c16t="true"
+              data-wp-component="FlexBlock"
+              for="inspector-toggle-control-2"
+            >
+              Meta Box 2
+            </label>
+          </div>
         </div>
       </div>
     </div>

package/src/components/sidebar/plugin-document-setting-panel/index.js

@@ -5,12 +5,12 @@ import { createSlotFill, PanelBody } from '@wordpress/components';
 import { usePluginContext } from '@wordpress/plugins';
 import { useDispatch, useSelect } from '@wordpress/data';
 import warning from '@wordpress/warning';
+import { store as editorStore } from '@wordpress/editor';
 
 /**
  * Internal dependencies
  */
 import { EnablePluginDocumentSettingPanelOption } from '../../preferences-modal/options';
-import { store as editPostStore } from '../../../store';
 
 const { Fill, Slot } = createSlotFill( 'PluginDocumentSettingPanel' );
 
@@ -78,7 +78,7 @@ const PluginDocumentSettingPanel = ( {
 	const { opened, isEnabled } = useSelect(
 		( select ) => {
 			const { isEditorPanelOpened, isEditorPanelEnabled } =
-				select( editPostStore );
+				select( editorStore );
 
 			return {
 				opened: isEditorPanelOpened( panelName ),
@@ -87,7 +87,7 @@ const PluginDocumentSettingPanel = ( {
 		},
 		[ panelName ]
 	);
-	const { toggleEditorPanelOpened } = useDispatch( editPostStore );
+	const { toggleEditorPanelOpened } = useDispatch( editorStore );
 
 	if ( undefined === name ) {
 		warning( 'PluginDocumentSettingPanel requires a name property.' );

package/src/components/sidebar/plugin-sidebar/index.js

@@ -7,11 +7,6 @@ import { __ } from '@wordpress/i18n';
 import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
 import { store as editorStore } from '@wordpress/editor';
 
-/**
- * Internal dependencies
- */
-import { store as editPostStore } from '../../../store';
-
 /**
  * Renders a sidebar when activated. The contents within the `PluginSidebar` will appear as content within the sidebar.
  * It also automatically renders a corresponding `PluginSidebarMenuItem` component when `isPinnable` flag is set to `true`.
@@ -78,14 +73,12 @@ import { store as editPostStore } from '../../../store';
  * ```
  */
 export default function PluginSidebarEditPost( { className, ...props } ) {
-	const { postTitle, shortcut, showIconLabels } = useSelect( ( select ) => {
+	const { postTitle, shortcut } = useSelect( ( select ) => {
 		return {
 			postTitle: select( editorStore ).getEditedPostAttribute( 'title' ),
 			shortcut: select(
 				keyboardShortcutsStore
 			).getShortcutRepresentation( 'core/edit-post/toggle-sidebar' ),
-			showIconLabels:
-				select( editPostStore ).isFeatureActive( 'showIconLabels' ),
 		};
 	}, [] );
 	return (
@@ -95,7 +88,6 @@ export default function PluginSidebarEditPost( { className, ...props } ) {
 			smallScreenTitle={ postTitle || __( '(no title)' ) }
 			scope="core/edit-post"
 			toggleShortcut={ shortcut }
-			showIconLabels={ showIconLabels }
 			{ ...props }
 		/>
 	);

package/src/components/sidebar/post-status/index.js

@@ -14,6 +14,7 @@ import {
 	PostSyncStatus,
 	PostURLPanel,
 	PostTemplatePanel,
+	store as editorStore,
 } from '@wordpress/editor';
 
 /**
@@ -26,7 +27,6 @@ import PostSlug from '../post-slug';
 import PostFormat from '../post-format';
 import PostPendingStatus from '../post-pending-status';
 import PluginPostStatusInfo from '../plugin-post-status-info';
-import { store as editPostStore } from '../../../store';
 
 /**
  * Module Constants
@@ -38,13 +38,13 @@ export default function PostStatus() {
 		// We use isEditorPanelRemoved to hide the panel if it was programatically removed. We do
 		// not use isEditorPanelEnabled since this panel should not be disabled through the UI.
 		const { isEditorPanelRemoved, isEditorPanelOpened } =
-			select( editPostStore );
+			select( editorStore );
 		return {
 			isRemoved: isEditorPanelRemoved( PANEL_NAME ),
 			isOpened: isEditorPanelOpened( PANEL_NAME ),
 		};
 	}, [] );
-	const { toggleEditorPanelOpened } = useDispatch( editPostStore );
+	const { toggleEditorPanelOpened } = useDispatch( editorStore );
 
 	if ( isRemoved ) {
 		return null;

package/src/components/sidebar/settings-sidebar/index.js

@@ -11,19 +11,21 @@ import { isRTL, __ } from '@wordpress/i18n';
 import { drawerLeft, drawerRight } from '@wordpress/icons';
 import { store as interfaceStore } from '@wordpress/interface';
 import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
-import { store as editorStore } from '@wordpress/editor';
+import {
+	store as editorStore,
+	PageAttributesPanel,
+	PostDiscussionPanel,
+	PostExcerptPanel,
+	PostFeaturedImagePanel,
+	PostLastRevisionPanel,
+	PostTaxonomiesPanel,
+} from '@wordpress/editor';
 
 /**
  * Internal dependencies
  */
 import SettingsHeader from '../settings-header';
 import PostStatus from '../post-status';
-import LastRevision from '../last-revision';
-import PostTaxonomies from '../post-taxonomies';
-import FeaturedImage from '../featured-image';
-import PostExcerpt from '../post-excerpt';
-import DiscussionPanel from '../discussion-panel';
-import PageAttributes from '../page-attributes';
 import MetaBoxes from '../../meta-boxes';
 import PluginDocumentSettingPanel from '../plugin-document-setting-panel';
 import PluginSidebarEditPost from '../plugin-sidebar';
@@ -79,12 +81,12 @@ const SidebarContent = ( {
 						<>
 							<PostStatus />
 							<PluginDocumentSettingPanel.Slot />
-							<LastRevision />
-							<PostTaxonomies />
-							<FeaturedImage />
-							<PostExcerpt />
-							<DiscussionPanel />
-							<PageAttributes />
+							<PostLastRevisionPanel />
+							<PostTaxonomiesPanel />
+							<PostFeaturedImagePanel />
+							<PostExcerptPanel />
+							<PostDiscussionPanel />
+							<PageAttributesPanel />
 							<MetaBoxes location="side" />
 						</>
 					) }

package/src/components/text-editor/style.scss

@@ -39,10 +39,8 @@
 	margin-right: auto;
 
 	@include break-large() {
-		padding: $grid-unit-20 $grid-unit-30 #{ $grid-unit-60 * 2 } $grid-unit-30;
 		padding: 0 $grid-unit-30 $grid-unit-30 $grid-unit-30;
 	}
-
 }
 
 // Exit code editor toolbar.
@@ -70,8 +68,4 @@
 		font-size: $default-font-size;
 		color: $gray-900;
 	}
-
-	.components-button svg {
-		order: 1;
-	}
 }