@wordpress/edit-site 5.1.0 → 5.2.0

package/build-module/hooks/push-changes-to-global-styles/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/hooks/push-changes-to-global-styles/index.js"],"names":["get","set","addFilter","createHigherOrderComponent","InspectorAdvancedControls","store","blockEditorStore","BaseControl","Button","__","sprintf","__EXPERIMENTAL_STYLE_PROPERTY","STYLE_PROPERTY","getBlockType","useContext","useMemo","useCallback","useDispatch","noticesStore","getSupportedGlobalStylesPanels","GlobalStylesContext","STYLE_PATH_TO_CSS_VAR_INFIX","STYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE","getChangesToPush","name","attributes","flatMap","key","value","path","presetAttributeKey","join","presetAttributeValue","style","cloneDeep","object","JSON","parse","stringify","PushChangesToGlobalStylesControl","setAttributes","changes","user","userConfig","setUserConfig","__unstableMarkNextChangeAsNotPersistent","createSuccessNotice","pushChanges","length","blockStyles","newBlockStyles","newUserConfig","undefined","undoIgnore","title","type","actions","label","onClick","withPushChangesToGlobalStyles","BlockEdit","props"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { get, set } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { createHigherOrderComponent } from '@wordpress/compose';\nimport {\n\tInspectorAdvancedControls,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { BaseControl, Button } from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\t__EXPERIMENTAL_STYLE_PROPERTY as STYLE_PROPERTY,\n\tgetBlockType,\n} from '@wordpress/blocks';\nimport { useContext, useMemo, useCallback } from '@wordpress/element';\nimport { useDispatch } from '@wordpress/data';\nimport { store as noticesStore } from '@wordpress/notices';\n\n/**\n * Internal dependencies\n */\nimport { getSupportedGlobalStylesPanels } from '../../components/global-styles/hooks';\nimport { GlobalStylesContext } from '../../components/global-styles/context';\nimport {\n\tSTYLE_PATH_TO_CSS_VAR_INFIX,\n\tSTYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE,\n} from '../../components/global-styles/utils';\n\nfunction getChangesToPush( name, attributes ) {\n\treturn getSupportedGlobalStylesPanels( name ).flatMap( ( key ) => {\n\t\tif ( ! STYLE_PROPERTY[ key ] ) {\n\t\t\treturn [];\n\t\t}\n\t\tconst { value: path } = STYLE_PROPERTY[ key ];\n\t\tconst presetAttributeKey = path.join( '.' );\n\t\tconst presetAttributeValue =\n\t\t\tattributes[\n\t\t\t\tSTYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE[ presetAttributeKey ]\n\t\t\t];\n\t\tconst value = presetAttributeValue\n\t\t\t? `var:preset|${ STYLE_PATH_TO_CSS_VAR_INFIX[ presetAttributeKey ] }|${ presetAttributeValue }`\n\t\t\t: get( attributes.style, path );\n\t\treturn value ? [ { path, value } ] : [];\n\t} );\n}\n\nfunction cloneDeep( object ) {\n\treturn ! object ? {} : JSON.parse( JSON.stringify( object ) );\n}\n\nfunction PushChangesToGlobalStylesControl( {\n\tname,\n\tattributes,\n\tsetAttributes,\n} ) {\n\tconst changes = useMemo(\n\t\t() => getChangesToPush( name, attributes ),\n\t\t[ name, attributes ]\n\t);\n\n\tconst { user: userConfig, setUserConfig } =\n\t\tuseContext( GlobalStylesContext );\n\n\tconst { __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\tconst { createSuccessNotice } = useDispatch( noticesStore );\n\n\tconst pushChanges = useCallback( () => {\n\t\tif ( changes.length === 0 ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { style: blockStyles } = attributes;\n\n\t\tconst newBlockStyles = cloneDeep( blockStyles );\n\t\tconst newUserConfig = cloneDeep( userConfig );\n\n\t\tfor ( const { path, value } of changes ) {\n\t\t\tset( newBlockStyles, path, undefined );\n\t\t\tset( newUserConfig, [ 'styles', 'blocks', name, ...path ], value );\n\t\t}\n\n\t\t// @wordpress/core-data doesn't support editing multiple entity types in\n\t\t// a single undo level. So for now, we disable @wordpress/core-data undo\n\t\t// tracking and implement our own Undo button in the snackbar\n\t\t// notification.\n\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\tsetAttributes( { style: newBlockStyles } );\n\t\tsetUserConfig( () => newUserConfig, { undoIgnore: true } );\n\n\t\tcreateSuccessNotice(\n\t\t\tsprintf(\n\t\t\t\t// translators: %s: Title of the block e.g. 'Heading'.\n\t\t\t\t__( 'Pushed styles to all %s blocks.' ),\n\t\t\t\tgetBlockType( name ).title\n\t\t\t),\n\t\t\t{\n\t\t\t\ttype: 'snackbar',\n\t\t\t\tactions: [\n\t\t\t\t\t{\n\t\t\t\t\t\tlabel: __( 'Undo' ),\n\t\t\t\t\t\tonClick() {\n\t\t\t\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\t\t\t\tsetAttributes( { style: blockStyles } );\n\t\t\t\t\t\t\tsetUserConfig( () => userConfig, {\n\t\t\t\t\t\t\t\tundoIgnore: true,\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],\n\t\t\t}\n\t\t);\n\t}, [ changes, attributes, userConfig, name ] );\n\n\treturn (\n\t\t<BaseControl\n\t\t\tclassName=\"edit-site-push-changes-to-global-styles-control\"\n\t\t\thelp={ sprintf(\n\t\t\t\t// translators: %s: Title of the block e.g. 'Heading'.\n\t\t\t\t__(\n\t\t\t\t\t'Move this block’s typography, spacing, dimensions, and color styles to all %s blocks.'\n\t\t\t\t),\n\t\t\t\tgetBlockType( name ).title\n\t\t\t) }\n\t\t>\n\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t{ __( 'Styles' ) }\n\t\t\t</BaseControl.VisualLabel>\n\t\t\t<Button\n\t\t\t\tvariant=\"primary\"\n\t\t\t\tdisabled={ changes.length === 0 }\n\t\t\t\tonClick={ pushChanges }\n\t\t\t>\n\t\t\t\t{ __( 'Push changes to Global Styles' ) }\n\t\t\t</Button>\n\t\t</BaseControl>\n\t);\n}\n\nconst withPushChangesToGlobalStyles = createHigherOrderComponent(\n\t( BlockEdit ) => ( props ) =>\n\t\t(\n\t\t\t<>\n\t\t\t\t<BlockEdit { ...props } />\n\t\t\t\t<InspectorAdvancedControls>\n\t\t\t\t\t<PushChangesToGlobalStylesControl { ...props } />\n\t\t\t\t</InspectorAdvancedControls>\n\t\t\t</>\n\t\t)\n);\n\naddFilter(\n\t'editor.BlockEdit',\n\t'core/edit-site/push-changes-to-global-styles',\n\twithPushChangesToGlobalStyles\n);\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/hooks/push-changes-to-global-styles/index.js"],"names":["get","set","addFilter","createHigherOrderComponent","InspectorAdvancedControls","store","blockEditorStore","BaseControl","Button","__","sprintf","__EXPERIMENTAL_STYLE_PROPERTY","STYLE_PROPERTY","getBlockType","useContext","useMemo","useCallback","useDispatch","noticesStore","getSupportedGlobalStylesPanels","GlobalStylesContext","STYLE_PATH_TO_CSS_VAR_INFIX","STYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE","getChangesToPush","name","attributes","flatMap","key","value","path","presetAttributeKey","join","presetAttributeValue","style","cloneDeep","object","JSON","parse","stringify","PushChangesToGlobalStylesControl","setAttributes","changes","user","userConfig","setUserConfig","__unstableMarkNextChangeAsNotPersistent","createSuccessNotice","pushChanges","length","blockStyles","newBlockStyles","newUserConfig","undefined","undoIgnore","title","type","actions","label","onClick","withPushChangesToGlobalStyles","BlockEdit","props"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { get, set } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { addFilter } from '@wordpress/hooks';\nimport { createHigherOrderComponent } from '@wordpress/compose';\nimport {\n\tInspectorAdvancedControls,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { BaseControl, Button } from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\t__EXPERIMENTAL_STYLE_PROPERTY as STYLE_PROPERTY,\n\tgetBlockType,\n} from '@wordpress/blocks';\nimport { useContext, useMemo, useCallback } from '@wordpress/element';\nimport { useDispatch } from '@wordpress/data';\nimport { store as noticesStore } from '@wordpress/notices';\n\n/**\n * Internal dependencies\n */\nimport { getSupportedGlobalStylesPanels } from '../../components/global-styles/hooks';\nimport { GlobalStylesContext } from '../../components/global-styles/context';\nimport {\n\tSTYLE_PATH_TO_CSS_VAR_INFIX,\n\tSTYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE,\n} from '../../components/global-styles/utils';\n\nfunction getChangesToPush( name, attributes ) {\n\treturn getSupportedGlobalStylesPanels( name ).flatMap( ( key ) => {\n\t\tif ( ! STYLE_PROPERTY[ key ] ) {\n\t\t\treturn [];\n\t\t}\n\t\tconst { value: path } = STYLE_PROPERTY[ key ];\n\t\tconst presetAttributeKey = path.join( '.' );\n\t\tconst presetAttributeValue =\n\t\t\tattributes[\n\t\t\t\tSTYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE[ presetAttributeKey ]\n\t\t\t];\n\t\tconst value = presetAttributeValue\n\t\t\t? `var:preset|${ STYLE_PATH_TO_CSS_VAR_INFIX[ presetAttributeKey ] }|${ presetAttributeValue }`\n\t\t\t: get( attributes.style, path );\n\t\treturn value ? [ { path, value } ] : [];\n\t} );\n}\n\nfunction cloneDeep( object ) {\n\treturn ! object ? {} : JSON.parse( JSON.stringify( object ) );\n}\n\nfunction PushChangesToGlobalStylesControl( {\n\tname,\n\tattributes,\n\tsetAttributes,\n} ) {\n\tconst changes = useMemo(\n\t\t() => getChangesToPush( name, attributes ),\n\t\t[ name, attributes ]\n\t);\n\n\tconst { user: userConfig, setUserConfig } =\n\t\tuseContext( GlobalStylesContext );\n\n\tconst { __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\tconst { createSuccessNotice } = useDispatch( noticesStore );\n\n\tconst pushChanges = useCallback( () => {\n\t\tif ( changes.length === 0 ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { style: blockStyles } = attributes;\n\n\t\tconst newBlockStyles = cloneDeep( blockStyles );\n\t\tconst newUserConfig = cloneDeep( userConfig );\n\n\t\tfor ( const { path, value } of changes ) {\n\t\t\tset( newBlockStyles, path, undefined );\n\t\t\tset( newUserConfig, [ 'styles', 'blocks', name, ...path ], value );\n\t\t}\n\n\t\t// @wordpress/core-data doesn't support editing multiple entity types in\n\t\t// a single undo level. So for now, we disable @wordpress/core-data undo\n\t\t// tracking and implement our own Undo button in the snackbar\n\t\t// notification.\n\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\tsetAttributes( { style: newBlockStyles } );\n\t\tsetUserConfig( () => newUserConfig, { undoIgnore: true } );\n\n\t\tcreateSuccessNotice(\n\t\t\tsprintf(\n\t\t\t\t// translators: %s: Title of the block e.g. 'Heading'.\n\t\t\t\t__( '%s styles applied.' ),\n\t\t\t\tgetBlockType( name ).title\n\t\t\t),\n\t\t\t{\n\t\t\t\ttype: 'snackbar',\n\t\t\t\tactions: [\n\t\t\t\t\t{\n\t\t\t\t\t\tlabel: __( 'Undo' ),\n\t\t\t\t\t\tonClick() {\n\t\t\t\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\t\t\t\tsetAttributes( { style: blockStyles } );\n\t\t\t\t\t\t\tsetUserConfig( () => userConfig, {\n\t\t\t\t\t\t\t\tundoIgnore: true,\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],\n\t\t\t}\n\t\t);\n\t}, [ changes, attributes, userConfig, name ] );\n\n\treturn (\n\t\t<BaseControl\n\t\t\tclassName=\"edit-site-push-changes-to-global-styles-control\"\n\t\t\thelp={ sprintf(\n\t\t\t\t// translators: %s: Title of the block e.g. 'Heading'.\n\t\t\t\t__(\n\t\t\t\t\t'Apply this block’s typography, spacing, dimensions, and color styles to all %s blocks.'\n\t\t\t\t),\n\t\t\t\tgetBlockType( name ).title\n\t\t\t) }\n\t\t>\n\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t{ __( 'Styles' ) }\n\t\t\t</BaseControl.VisualLabel>\n\t\t\t<Button\n\t\t\t\tvariant=\"primary\"\n\t\t\t\tdisabled={ changes.length === 0 }\n\t\t\t\tonClick={ pushChanges }\n\t\t\t>\n\t\t\t\t{ __( 'Apply globally' ) }\n\t\t\t</Button>\n\t\t</BaseControl>\n\t);\n}\n\nconst withPushChangesToGlobalStyles = createHigherOrderComponent(\n\t( BlockEdit ) => ( props ) =>\n\t\t(\n\t\t\t<>\n\t\t\t\t<BlockEdit { ...props } />\n\t\t\t\t<InspectorAdvancedControls>\n\t\t\t\t\t<PushChangesToGlobalStylesControl { ...props } />\n\t\t\t\t</InspectorAdvancedControls>\n\t\t\t</>\n\t\t)\n);\n\naddFilter(\n\t'editor.BlockEdit',\n\t'core/edit-site/push-changes-to-global-styles',\n\twithPushChangesToGlobalStyles\n);\n"]}

package/build-module/store/reducer.js

@@ -157,7 +157,7 @@ export function saveViewPanel() {
  */
 
 function canvasMode() {
-  let state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'view';
+  let state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'init';
   let action = arguments.length > 1 ? arguments[1] : undefined;
 
   switch (action.type) {

package/build-module/store/reducer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/store/reducer.js"],"names":["combineReducers","deviceType","state","action","type","settings","editedPost","postType","id","context","blockInserterPanel","isOpen","value","listViewPanel","saveViewPanel","canvasMode","mode"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { combineReducers } from '@wordpress/data';\n\n/**\n * Reducer returning the editing canvas device type.\n *\n * @param {Object} state  Current state.\n * @param {Object} action Dispatched action.\n *\n * @return {Object} Updated state.\n */\nexport function deviceType( state = 'Desktop', action ) {\n\tswitch ( action.type ) {\n\t\tcase 'SET_PREVIEW_DEVICE_TYPE':\n\t\t\treturn action.deviceType;\n\t}\n\n\treturn state;\n}\n\n/**\n * Reducer returning the settings.\n *\n * @param {Object} state  Current state.\n * @param {Object} action Dispatched action.\n *\n * @return {Object} Updated state.\n */\nexport function settings( state = {}, action ) {\n\tswitch ( action.type ) {\n\t\tcase 'UPDATE_SETTINGS':\n\t\t\treturn {\n\t\t\t\t...state,\n\t\t\t\t...action.settings,\n\t\t\t};\n\t}\n\n\treturn state;\n}\n\n/**\n * Reducer keeping track of the currently edited Post Type,\n * Post Id and the context provided to fill the content of the block editor.\n *\n * @param {Object} state  Current edited post.\n * @param {Object} action Dispatched action.\n *\n * @return {Object} Updated state.\n */\nexport function editedPost( state = {}, action ) {\n\tswitch ( action.type ) {\n\t\tcase 'SET_EDITED_POST':\n\t\t\treturn {\n\t\t\t\tpostType: action.postType,\n\t\t\t\tid: action.id,\n\t\t\t\tcontext: action.context,\n\t\t\t};\n\t\tcase 'SET_EDITED_POST_CONTEXT':\n\t\t\treturn {\n\t\t\t\t...state,\n\t\t\t\tcontext: action.context,\n\t\t\t};\n\t}\n\n\treturn state;\n}\n\n/**\n * Reducer to set the block inserter panel open or closed.\n *\n * Note: this reducer interacts with the navigation and list view panels reducers\n * to make sure that only one of the three panels is open at the same time.\n *\n * @param {boolean|Object} state  Current state.\n * @param {Object}         action Dispatched action.\n */\nexport function blockInserterPanel( state = false, action ) {\n\tswitch ( action.type ) {\n\t\tcase 'SET_IS_LIST_VIEW_OPENED':\n\t\t\treturn action.isOpen ? false : state;\n\t\tcase 'SET_IS_INSERTER_OPENED':\n\t\t\treturn action.value;\n\t\tcase 'SET_CANVAS_MODE':\n\t\t\treturn false;\n\t}\n\treturn state;\n}\n\n/**\n * Reducer to set the list view panel open or closed.\n *\n * Note: this reducer interacts with the navigation and inserter panels reducers\n * to make sure that only one of the three panels is open at the same time.\n *\n * @param {Object} state  Current state.\n * @param {Object} action Dispatched action.\n */\nexport function listViewPanel( state = false, action ) {\n\tswitch ( action.type ) {\n\t\tcase 'SET_IS_INSERTER_OPENED':\n\t\t\treturn action.value ? false : state;\n\t\tcase 'SET_IS_LIST_VIEW_OPENED':\n\t\t\treturn action.isOpen;\n\t\tcase 'SET_CANVAS_MODE':\n\t\t\treturn false;\n\t}\n\treturn state;\n}\n\n/**\n * Reducer to set the save view panel open or closed.\n *\n * @param {Object} state  Current state.\n * @param {Object} action Dispatched action.\n */\nexport function saveViewPanel( state = false, action ) {\n\tswitch ( action.type ) {\n\t\tcase 'SET_IS_SAVE_VIEW_OPENED':\n\t\t\treturn action.isOpen;\n\t\tcase 'SET_CANVAS_MODE':\n\t\t\treturn false;\n\t}\n\treturn state;\n}\n\n/**\n * Reducer used to track the site editor canvas mode (edit or view).\n *\n * @param {Object} state  Current state.\n * @param {Object} action Dispatched action.\n */\nfunction canvasMode( state = 'view', action ) {\n\tswitch ( action.type ) {\n\t\tcase 'SET_CANVAS_MODE':\n\t\t\treturn action.mode;\n\t}\n\n\treturn state;\n}\n\nexport default combineReducers( {\n\tdeviceType,\n\tsettings,\n\teditedPost,\n\tblockInserterPanel,\n\tlistViewPanel,\n\tsaveViewPanel,\n\tcanvasMode,\n} );\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/store/reducer.js"],"names":["combineReducers","deviceType","state","action","type","settings","editedPost","postType","id","context","blockInserterPanel","isOpen","value","listViewPanel","saveViewPanel","canvasMode","mode"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { combineReducers } from '@wordpress/data';\n\n/**\n * Reducer returning the editing canvas device type.\n *\n * @param {Object} state  Current state.\n * @param {Object} action Dispatched action.\n *\n * @return {Object} Updated state.\n */\nexport function deviceType( state = 'Desktop', action ) {\n\tswitch ( action.type ) {\n\t\tcase 'SET_PREVIEW_DEVICE_TYPE':\n\t\t\treturn action.deviceType;\n\t}\n\n\treturn state;\n}\n\n/**\n * Reducer returning the settings.\n *\n * @param {Object} state  Current state.\n * @param {Object} action Dispatched action.\n *\n * @return {Object} Updated state.\n */\nexport function settings( state = {}, action ) {\n\tswitch ( action.type ) {\n\t\tcase 'UPDATE_SETTINGS':\n\t\t\treturn {\n\t\t\t\t...state,\n\t\t\t\t...action.settings,\n\t\t\t};\n\t}\n\n\treturn state;\n}\n\n/**\n * Reducer keeping track of the currently edited Post Type,\n * Post Id and the context provided to fill the content of the block editor.\n *\n * @param {Object} state  Current edited post.\n * @param {Object} action Dispatched action.\n *\n * @return {Object} Updated state.\n */\nexport function editedPost( state = {}, action ) {\n\tswitch ( action.type ) {\n\t\tcase 'SET_EDITED_POST':\n\t\t\treturn {\n\t\t\t\tpostType: action.postType,\n\t\t\t\tid: action.id,\n\t\t\t\tcontext: action.context,\n\t\t\t};\n\t\tcase 'SET_EDITED_POST_CONTEXT':\n\t\t\treturn {\n\t\t\t\t...state,\n\t\t\t\tcontext: action.context,\n\t\t\t};\n\t}\n\n\treturn state;\n}\n\n/**\n * Reducer to set the block inserter panel open or closed.\n *\n * Note: this reducer interacts with the navigation and list view panels reducers\n * to make sure that only one of the three panels is open at the same time.\n *\n * @param {boolean|Object} state  Current state.\n * @param {Object}         action Dispatched action.\n */\nexport function blockInserterPanel( state = false, action ) {\n\tswitch ( action.type ) {\n\t\tcase 'SET_IS_LIST_VIEW_OPENED':\n\t\t\treturn action.isOpen ? false : state;\n\t\tcase 'SET_IS_INSERTER_OPENED':\n\t\t\treturn action.value;\n\t\tcase 'SET_CANVAS_MODE':\n\t\t\treturn false;\n\t}\n\treturn state;\n}\n\n/**\n * Reducer to set the list view panel open or closed.\n *\n * Note: this reducer interacts with the navigation and inserter panels reducers\n * to make sure that only one of the three panels is open at the same time.\n *\n * @param {Object} state  Current state.\n * @param {Object} action Dispatched action.\n */\nexport function listViewPanel( state = false, action ) {\n\tswitch ( action.type ) {\n\t\tcase 'SET_IS_INSERTER_OPENED':\n\t\t\treturn action.value ? false : state;\n\t\tcase 'SET_IS_LIST_VIEW_OPENED':\n\t\t\treturn action.isOpen;\n\t\tcase 'SET_CANVAS_MODE':\n\t\t\treturn false;\n\t}\n\treturn state;\n}\n\n/**\n * Reducer to set the save view panel open or closed.\n *\n * @param {Object} state  Current state.\n * @param {Object} action Dispatched action.\n */\nexport function saveViewPanel( state = false, action ) {\n\tswitch ( action.type ) {\n\t\tcase 'SET_IS_SAVE_VIEW_OPENED':\n\t\t\treturn action.isOpen;\n\t\tcase 'SET_CANVAS_MODE':\n\t\t\treturn false;\n\t}\n\treturn state;\n}\n\n/**\n * Reducer used to track the site editor canvas mode (edit or view).\n *\n * @param {Object} state  Current state.\n * @param {Object} action Dispatched action.\n */\nfunction canvasMode( state = 'init', action ) {\n\tswitch ( action.type ) {\n\t\tcase 'SET_CANVAS_MODE':\n\t\t\treturn action.mode;\n\t}\n\n\treturn state;\n}\n\nexport default combineReducers( {\n\tdeviceType,\n\tsettings,\n\teditedPost,\n\tblockInserterPanel,\n\tlistViewPanel,\n\tsaveViewPanel,\n\tcanvasMode,\n} );\n"]}

package/build-style/style-rtl.css

@@ -501,6 +501,9 @@ body.is-fullscreen-mode .interface-interface-skeleton {
   box-shadow: none;
   font-weight: 500;
 }
+.interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item.is-active::after {
+  content: none;
+}
 .interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item:focus:not(:disabled) {
   box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 }
@@ -609,16 +612,49 @@ body.is-fullscreen-mode .interface-interface-skeleton {
   bottom: 0;
   padding: 0;
   margin: auto 0;
-  width: 4px;
-  height: 100px;
+  width: 12px;
   -webkit-appearance: none;
           appearance: none;
   cursor: ew-resize;
   outline: none;
-  background: #949494;
+  background: none;
   border-radius: 2px;
   border: 0;
 }
+.resizable-editor__drag-handle.is-variation-default {
+  height: 100px;
+}
+.resizable-editor__drag-handle.is-variation-separator {
+  height: 100%;
+}
+.resizable-editor__drag-handle.is-variation-separator::after {
+  width: 1px;
+  border-radius: 0;
+  background: #2f2f2f;
+  right: auto;
+  left: 50%;
+  transition: all ease 0.2s;
+  transition-delay: 0.1s;
+}
+@media (prefers-reduced-motion: reduce) {
+  .resizable-editor__drag-handle.is-variation-separator::after {
+    transition-duration: 0s;
+    transition-delay: 0s;
+    animation-duration: 1ms;
+    animation-delay: 0s;
+  }
+}
+.resizable-editor__drag-handle::after {
+  position: absolute;
+  top: 0;
+  right: 4px;
+  left: 0;
+  bottom: 0;
+  content: "";
+  width: 4px;
+  background: #949494;
+  border-radius: 2px;
+}
 .resizable-editor__drag-handle.is-left {
   right: -16px;
 }
@@ -626,9 +662,16 @@ body.is-fullscreen-mode .interface-interface-skeleton {
   left: -16px;
 }
 .resizable-editor__drag-handle:hover, .resizable-editor__drag-handle:active {
+  opacity: 1;
+}
+.resizable-editor__drag-handle:hover.is-variation-default::after, .resizable-editor__drag-handle:active.is-variation-default::after {
   background: #ccc;
 }
-.resizable-editor__drag-handle:focus {
+.resizable-editor__drag-handle:hover.is-variation-separator::after, .resizable-editor__drag-handle:active.is-variation-separator::after {
+  width: 2px;
+  background: var(--wp-admin-theme-color);
+}
+.resizable-editor__drag-handle:focus::after {
   box-shadow: 0 0 0 1px #2f2f2f, 0 0 0 calc(var(--wp-admin-border-width-focus) + 1px) var(--wp-admin-theme-color);
 }
 
@@ -867,6 +910,14 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp
   overflow-y: scroll;
 }
 
+.edit-site-global-styles-screen-variations {
+  margin-top: 16px;
+  border-top: 1px solid #ddd;
+}
+.edit-site-global-styles-screen-variations > * {
+  margin: 24px 16px;
+}
+
 .edit-site-header-edit-mode {
   height: 60px;
   align-items: center;
@@ -1607,6 +1658,9 @@ body.is-fullscreen-mode .edit-site-list-header {
 .edit-site-navigation-inspector .block-editor-list-view-block__menu-cell {
   padding-left: 0;
 }
+.edit-site-navigation-inspector .edit-site-navigation-inspector__select-menu {
+  margin-bottom: 8px;
+}
 
 .edit-site-navigation-inspector__placeholder {
   padding: 8px;
@@ -2063,51 +2117,67 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar {
 .edit-site-layout__content {
   flex-grow: 1;
   display: flex;
+  gap: 24px;
   overflow: hidden;
 }
 
 .edit-site-layout__sidebar {
   z-index: 1;
-  overflow-y: auto;
   width: 100vw;
+}
+@media (min-width: 782px) {
+  .edit-site-layout__sidebar {
+    width: 360px;
+  }
+}
+.edit-site-layout.is-full-canvas .edit-site-layout__sidebar {
+  position: fixed !important;
+  height: 100vh;
+  right: 0;
+  top: 0;
+}
+.edit-site-layout__sidebar .resizable-editor__drag-handle.is-right {
+  left: -6px;
+}
+.edit-site-layout__sidebar > div {
+  overflow-y: auto;
+  min-height: 100%;
   visibility: hidden;
   scrollbar-color: #757575 #1e1e1e;
   scrollbar-width: thin;
   scrollbar-gutter: stable;
 }
-.edit-site-layout__sidebar::-webkit-scrollbar {
+.edit-site-layout__sidebar > div::-webkit-scrollbar {
   width: 12px;
   height: 12px;
 }
-.edit-site-layout__sidebar::-webkit-scrollbar-track {
+.edit-site-layout__sidebar > div::-webkit-scrollbar-track {
   background-color: #1e1e1e;
 }
-.edit-site-layout__sidebar::-webkit-scrollbar-thumb {
+.edit-site-layout__sidebar > div::-webkit-scrollbar-thumb {
   background-color: #757575;
   border-radius: 8px;
   border: 3px solid transparent;
   background-clip: padding-box;
 }
-.edit-site-layout__sidebar:hover, .edit-site-layout__sidebar:focus, .edit-site-layout__sidebar > * {
+.edit-site-layout__sidebar > div:hover, .edit-site-layout__sidebar > div:focus, .edit-site-layout__sidebar > div > * {
   visibility: visible;
 }
-@media (min-width: 782px) {
-  .edit-site-layout__sidebar {
-    width: 360px;
-  }
-}
-.edit-site-layout.is-full-canvas .edit-site-layout__sidebar {
-  position: fixed;
-  height: 100vh;
-  right: 0;
-  top: 0;
-}
 
 .edit-site-layout__canvas-container {
   position: relative;
   flex-grow: 1;
   z-index: 2;
 }
+.edit-site-layout__canvas-container.is-resizing::after {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  bottom: 0;
+  content: "";
+  z-index: 100;
+}
 
 .edit-site-layout__canvas {
   position: absolute;
@@ -2115,11 +2185,11 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar {
   right: 0;
   bottom: 0;
   width: 100%;
-  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.8), 0 8px 10px -6px rgba(0, 0, 0, 0.8);
 }
 .edit-site-layout__canvas > div {
   color: #1e1e1e;
   background: #fff;
+  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.8), 0 8px 10px -6px rgba(0, 0, 0, 0.8);
 }
 @media (min-width: 782px) {
   .edit-site-layout__canvas {
@@ -2138,6 +2208,8 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar {
   top: 0;
   bottom: 0;
   width: 100%;
+}
+.edit-site-layout.is-full-canvas .edit-site-layout__canvas > div {
   border-radius: 0;
 }
 

package/build-style/style.css

@@ -501,6 +501,9 @@ body.is-fullscreen-mode .interface-interface-skeleton {
   box-shadow: none;
   font-weight: 500;
 }
+.interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item.is-active::after {
+  content: none;
+}
 .interface-preferences__tabs .components-tab-panel__tabs .components-tab-panel__tabs-item:focus:not(:disabled) {
   box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 }
@@ -609,16 +612,49 @@ body.is-fullscreen-mode .interface-interface-skeleton {
   bottom: 0;
   padding: 0;
   margin: auto 0;
-  width: 4px;
-  height: 100px;
+  width: 12px;
   -webkit-appearance: none;
           appearance: none;
   cursor: ew-resize;
   outline: none;
-  background: #949494;
+  background: none;
   border-radius: 2px;
   border: 0;
 }
+.resizable-editor__drag-handle.is-variation-default {
+  height: 100px;
+}
+.resizable-editor__drag-handle.is-variation-separator {
+  height: 100%;
+}
+.resizable-editor__drag-handle.is-variation-separator::after {
+  width: 1px;
+  border-radius: 0;
+  background: #2f2f2f;
+  left: auto;
+  right: 50%;
+  transition: all ease 0.2s;
+  transition-delay: 0.1s;
+}
+@media (prefers-reduced-motion: reduce) {
+  .resizable-editor__drag-handle.is-variation-separator::after {
+    transition-duration: 0s;
+    transition-delay: 0s;
+    animation-duration: 1ms;
+    animation-delay: 0s;
+  }
+}
+.resizable-editor__drag-handle::after {
+  position: absolute;
+  top: 0;
+  left: 4px;
+  right: 0;
+  bottom: 0;
+  content: "";
+  width: 4px;
+  background: #949494;
+  border-radius: 2px;
+}
 .resizable-editor__drag-handle.is-left {
   left: -16px;
 }
@@ -626,9 +662,16 @@ body.is-fullscreen-mode .interface-interface-skeleton {
   right: -16px;
 }
 .resizable-editor__drag-handle:hover, .resizable-editor__drag-handle:active {
+  opacity: 1;
+}
+.resizable-editor__drag-handle:hover.is-variation-default::after, .resizable-editor__drag-handle:active.is-variation-default::after {
   background: #ccc;
 }
-.resizable-editor__drag-handle:focus {
+.resizable-editor__drag-handle:hover.is-variation-separator::after, .resizable-editor__drag-handle:active.is-variation-separator::after {
+  width: 2px;
+  background: var(--wp-admin-theme-color);
+}
+.resizable-editor__drag-handle:focus::after {
   box-shadow: 0 0 0 1px #2f2f2f, 0 0 0 calc(var(--wp-admin-border-width-focus) + 1px) var(--wp-admin-theme-color);
 }
 
@@ -867,6 +910,14 @@ textarea.edit-site-code-editor-text-area.edit-site-code-editor-text-area:-ms-inp
   overflow-y: scroll;
 }
 
+.edit-site-global-styles-screen-variations {
+  margin-top: 16px;
+  border-top: 1px solid #ddd;
+}
+.edit-site-global-styles-screen-variations > * {
+  margin: 24px 16px;
+}
+
 .edit-site-header-edit-mode {
   height: 60px;
   align-items: center;
@@ -1607,6 +1658,9 @@ body.is-fullscreen-mode .edit-site-list-header {
 .edit-site-navigation-inspector .block-editor-list-view-block__menu-cell {
   padding-right: 0;
 }
+.edit-site-navigation-inspector .edit-site-navigation-inspector__select-menu {
+  margin-bottom: 8px;
+}
 
 .edit-site-navigation-inspector__placeholder {
   padding: 8px;
@@ -2063,51 +2117,67 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar {
 .edit-site-layout__content {
   flex-grow: 1;
   display: flex;
+  gap: 24px;
   overflow: hidden;
 }
 
 .edit-site-layout__sidebar {
   z-index: 1;
-  overflow-y: auto;
   width: 100vw;
+}
+@media (min-width: 782px) {
+  .edit-site-layout__sidebar {
+    width: 360px;
+  }
+}
+.edit-site-layout.is-full-canvas .edit-site-layout__sidebar {
+  position: fixed !important;
+  height: 100vh;
+  left: 0;
+  top: 0;
+}
+.edit-site-layout__sidebar .resizable-editor__drag-handle.is-right {
+  right: -6px;
+}
+.edit-site-layout__sidebar > div {
+  overflow-y: auto;
+  min-height: 100%;
   visibility: hidden;
   scrollbar-color: #757575 #1e1e1e;
   scrollbar-width: thin;
   scrollbar-gutter: stable;
 }
-.edit-site-layout__sidebar::-webkit-scrollbar {
+.edit-site-layout__sidebar > div::-webkit-scrollbar {
   width: 12px;
   height: 12px;
 }
-.edit-site-layout__sidebar::-webkit-scrollbar-track {
+.edit-site-layout__sidebar > div::-webkit-scrollbar-track {
   background-color: #1e1e1e;
 }
-.edit-site-layout__sidebar::-webkit-scrollbar-thumb {
+.edit-site-layout__sidebar > div::-webkit-scrollbar-thumb {
   background-color: #757575;
   border-radius: 8px;
   border: 3px solid transparent;
   background-clip: padding-box;
 }
-.edit-site-layout__sidebar:hover, .edit-site-layout__sidebar:focus, .edit-site-layout__sidebar > * {
+.edit-site-layout__sidebar > div:hover, .edit-site-layout__sidebar > div:focus, .edit-site-layout__sidebar > div > * {
   visibility: visible;
 }
-@media (min-width: 782px) {
-  .edit-site-layout__sidebar {
-    width: 360px;
-  }
-}
-.edit-site-layout.is-full-canvas .edit-site-layout__sidebar {
-  position: fixed;
-  height: 100vh;
-  left: 0;
-  top: 0;
-}
 
 .edit-site-layout__canvas-container {
   position: relative;
   flex-grow: 1;
   z-index: 2;
 }
+.edit-site-layout__canvas-container.is-resizing::after {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  content: "";
+  z-index: 100;
+}
 
 .edit-site-layout__canvas {
   position: absolute;
@@ -2115,11 +2185,11 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar {
   left: 0;
   bottom: 0;
   width: 100%;
-  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.8), 0 8px 10px -6px rgba(0, 0, 0, 0.8);
 }
 .edit-site-layout__canvas > div {
   color: #1e1e1e;
   background: #fff;
+  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.8), 0 8px 10px -6px rgba(0, 0, 0, 0.8);
 }
 @media (min-width: 782px) {
   .edit-site-layout__canvas {
@@ -2138,6 +2208,8 @@ body.is-fullscreen-mode .edit-site .components-editor-notices__snackbar {
   top: 0;
   bottom: 0;
   width: 100%;
+}
+.edit-site-layout.is-full-canvas .edit-site-layout__canvas > div {
   border-radius: 0;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/edit-site",
-	"version": "5.1.0",
+	"version": "5.2.0",
 	"description": "Edit Site Page module for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -27,34 +27,34 @@
 	"react-native": "src/index",
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
-		"@wordpress/a11y": "^3.24.0",
-		"@wordpress/api-fetch": "^6.21.0",
-		"@wordpress/block-editor": "^11.1.0",
-		"@wordpress/block-library": "^8.1.0",
-		"@wordpress/blocks": "^12.1.0",
-		"@wordpress/components": "^23.1.0",
-		"@wordpress/compose": "^6.1.0",
-		"@wordpress/core-data": "^6.1.0",
-		"@wordpress/data": "^8.1.0",
-		"@wordpress/deprecated": "^3.24.0",
-		"@wordpress/editor": "^13.1.0",
-		"@wordpress/element": "^5.1.0",
-		"@wordpress/hooks": "^3.24.0",
-		"@wordpress/html-entities": "^3.24.0",
-		"@wordpress/i18n": "^4.24.0",
-		"@wordpress/icons": "^9.15.0",
-		"@wordpress/interface": "^5.1.0",
-		"@wordpress/keyboard-shortcuts": "^4.1.0",
-		"@wordpress/keycodes": "^3.24.0",
-		"@wordpress/media-utils": "^4.15.0",
-		"@wordpress/notices": "^3.24.0",
-		"@wordpress/plugins": "^5.1.0",
-		"@wordpress/preferences": "^3.1.0",
-		"@wordpress/reusable-blocks": "^4.1.0",
-		"@wordpress/style-engine": "^1.7.0",
-		"@wordpress/url": "^3.25.0",
-		"@wordpress/viewport": "^5.1.0",
-		"@wordpress/widgets": "^3.1.0",
+		"@wordpress/a11y": "^3.25.0",
+		"@wordpress/api-fetch": "^6.22.0",
+		"@wordpress/block-editor": "^11.2.0",
+		"@wordpress/block-library": "^8.2.0",
+		"@wordpress/blocks": "^12.2.0",
+		"@wordpress/components": "^23.2.0",
+		"@wordpress/compose": "^6.2.0",
+		"@wordpress/core-data": "^6.2.0",
+		"@wordpress/data": "^8.2.0",
+		"@wordpress/deprecated": "^3.25.0",
+		"@wordpress/editor": "^13.2.0",
+		"@wordpress/element": "^5.2.0",
+		"@wordpress/hooks": "^3.25.0",
+		"@wordpress/html-entities": "^3.25.0",
+		"@wordpress/i18n": "^4.25.0",
+		"@wordpress/icons": "^9.16.0",
+		"@wordpress/interface": "^5.2.0",
+		"@wordpress/keyboard-shortcuts": "^4.2.0",
+		"@wordpress/keycodes": "^3.25.0",
+		"@wordpress/media-utils": "^4.16.0",
+		"@wordpress/notices": "^3.25.0",
+		"@wordpress/plugins": "^5.2.0",
+		"@wordpress/preferences": "^3.2.0",
+		"@wordpress/reusable-blocks": "^4.2.0",
+		"@wordpress/style-engine": "^1.8.0",
+		"@wordpress/url": "^3.26.0",
+		"@wordpress/viewport": "^5.2.0",
+		"@wordpress/widgets": "^3.2.0",
 		"classnames": "^2.3.1",
 		"colord": "^2.9.2",
 		"downloadjs": "^1.4.7",
@@ -71,5 +71,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "200bee7b06b15f6fa655e25b6ab69cbd6b49a357"
+	"gitHead": "204c880ff65295768e9695dfee6c7a9fee1fdd05"
 }

package/src/components/add-new-template/new-template-part.js

@@ -20,6 +20,7 @@ import { plus } from '@wordpress/icons';
 import { useHistory } from '../routes';
 import { store as editSiteStore } from '../../store';
 import CreateTemplatePartModal from '../create-template-part-modal';
+import { useExistingTemplateParts } from './utils';
 
 export default function NewTemplatePart( {
 	postType,
@@ -31,6 +32,7 @@ export default function NewTemplatePart( {
 	const { createErrorNotice } = useDispatch( noticesStore );
 	const { saveEntityRecord } = useDispatch( coreStore );
 	const { __unstableSetCanvasMode } = useDispatch( editSiteStore );
+	const existingTemplateParts = useExistingTemplateParts();
 
 	async function createTemplatePart( { title, area } ) {
 		if ( ! title ) {
@@ -40,6 +42,26 @@ export default function NewTemplatePart( {
 			return;
 		}
 
+		const uniqueTitle = () => {
+			const lowercaseTitle = title.toLowerCase();
+			const existingTitles = existingTemplateParts.map(
+				( templatePart ) => templatePart.title.rendered.toLowerCase()
+			);
+
+			if ( ! existingTitles.includes( lowercaseTitle ) ) {
+				return title;
+			}
+
+			let suffix = 2;
+			while (
+				existingTitles.includes( `${ lowercaseTitle } ${ suffix }` )
+			) {
+				suffix++;
+			}
+
+			return `${ title } ${ suffix }`;
+		};
+
 		try {
 			// Currently template parts only allow latin chars.
 			// Fallback slug will receive suffix by default.
@@ -52,7 +74,7 @@ export default function NewTemplatePart( {
 				'wp_template_part',
 				{
 					slug: cleanSlug,
-					title,
+					title: uniqueTitle(),
 					content: '',
 					area,
 				},

package/src/components/add-new-template/utils.js

@@ -52,6 +52,20 @@ export const useExistingTemplates = () => {
 	);
 };
 
+export const useExistingTemplateParts = () => {
+	return useSelect(
+		( select ) =>
+			select( coreStore ).getEntityRecords(
+				'postType',
+				'wp_template_part',
+				{
+					per_page: -1,
+				}
+			),
+		[]
+	);
+};
+
 export const useDefaultTemplateTypes = () => {
 	return useSelect(
 		( select ) =>

package/src/components/block-editor/editor-canvas.js

@@ -53,7 +53,6 @@ function EditorCanvas( { enableResizing, settings, children, ...props } ) {
 					) }
 				</>
 			}
-			assets={ settings.__unstableResolvedAssets }
 			ref={ mouseMoveTypingRef }
 			name="editor-canvas"
 			className="edit-site-visual-editor__editor-canvas"