@wordpress/edit-site 5.0.0 → 5.1.0

package/build/components/global-styles/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/utils.js"],"names":["ROOT_BLOCK_NAME","ROOT_BLOCK_SELECTOR","ROOT_BLOCK_SUPPORTS","PRESET_METADATA","path","valueKey","cssVarInfix","classes","classSuffix","propertyName","valueFunc","slug","preset","typography","typographySettings","size","STYLE_PATH_TO_CSS_VAR_INFIX","findInPresetsBy","features","blockName","presetPath","presetProperty","presetValueValue","orderedPresetsByOrigin","presetByOrigin","origins","origin","presets","presetObject","find","highestPresetObjectWithSameSlug","undefined","getPresetVariableFromValue","variableStylePath","presetPropertyValue","metadata","data","getValueFromPresetVariable","variable","presetType","settings","result","getValueFromVariable","getValueFromCustomVariable","ref","refPath","split","USER_VALUE_PREFIX","THEME_VALUE_PREFIX","THEME_VALUE_SUFFIX","parsedVar","startsWith","slice","length","endsWith","type","scopeSelector","scope","selector","scopes","selectors","selectorsScoped","forEach","outer","inner","push","trim","join"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { get } from 'lodash';\n\n/**\n * Internal dependencies\n */\nimport { getTypographyFontSizeValue } from './typography-utils';\n\n/* Supporting data. */\nexport const ROOT_BLOCK_NAME = 'root';\nexport const ROOT_BLOCK_SELECTOR = 'body';\nexport const ROOT_BLOCK_SUPPORTS = [\n\t'background',\n\t'backgroundColor',\n\t'color',\n\t'linkColor',\n\t'buttonColor',\n\t'fontFamily',\n\t'fontSize',\n\t'fontStyle',\n\t'fontWeight',\n\t'lineHeight',\n\t'textDecoration',\n\t'textTransform',\n\t'padding',\n];\n\nexport const PRESET_METADATA = [\n\t{\n\t\tpath: [ 'color', 'palette' ],\n\t\tvalueKey: 'color',\n\t\tcssVarInfix: 'color',\n\t\tclasses: [\n\t\t\t{ classSuffix: 'color', propertyName: 'color' },\n\t\t\t{\n\t\t\t\tclassSuffix: 'background-color',\n\t\t\t\tpropertyName: 'background-color',\n\t\t\t},\n\t\t\t{\n\t\t\t\tclassSuffix: 'border-color',\n\t\t\t\tpropertyName: 'border-color',\n\t\t\t},\n\t\t],\n\t},\n\t{\n\t\tpath: [ 'color', 'gradients' ],\n\t\tvalueKey: 'gradient',\n\t\tcssVarInfix: 'gradient',\n\t\tclasses: [\n\t\t\t{\n\t\t\t\tclassSuffix: 'gradient-background',\n\t\t\t\tpropertyName: 'background',\n\t\t\t},\n\t\t],\n\t},\n\t{\n\t\tpath: [ 'color', 'duotone' ],\n\t\tcssVarInfix: 'duotone',\n\t\tvalueFunc: ( { slug } ) => `url( '#wp-duotone-${ slug }' )`,\n\t\tclasses: [],\n\t},\n\t{\n\t\tpath: [ 'typography', 'fontSizes' ],\n\t\tvalueFunc: ( preset, { typography: typographySettings } ) =>\n\t\t\tgetTypographyFontSizeValue( preset, typographySettings ),\n\t\tvalueKey: 'size',\n\t\tcssVarInfix: 'font-size',\n\t\tclasses: [ { classSuffix: 'font-size', propertyName: 'font-size' } ],\n\t},\n\t{\n\t\tpath: [ 'typography', 'fontFamilies' ],\n\t\tvalueKey: 'fontFamily',\n\t\tcssVarInfix: 'font-family',\n\t\tclasses: [\n\t\t\t{ classSuffix: 'font-family', propertyName: 'font-family' },\n\t\t],\n\t},\n\t{\n\t\tpath: [ 'spacing', 'spacingSizes' ],\n\t\tvalueKey: 'size',\n\t\tcssVarInfix: 'spacing',\n\t\tvalueFunc: ( { size } ) => size,\n\t\tclasses: [],\n\t},\n];\n\nconst STYLE_PATH_TO_CSS_VAR_INFIX = {\n\t'color.background': 'color',\n\t'color.text': 'color',\n\t'elements.link.color.text': 'color',\n\t'elements.button.color.text': 'color',\n\t'elements.button.backgroundColor': 'background-color',\n\t'elements.heading.color': 'color',\n\t'elements.heading.backgroundColor': 'background-color',\n\t'elements.heading.gradient': 'gradient',\n\t'color.gradient': 'gradient',\n\t'typography.fontSize': 'font-size',\n\t'typography.fontFamily': 'font-family',\n};\n\nfunction findInPresetsBy(\n\tfeatures,\n\tblockName,\n\tpresetPath,\n\tpresetProperty,\n\tpresetValueValue\n) {\n\t// Block presets take priority above root level presets.\n\tconst orderedPresetsByOrigin = [\n\t\tget( features, [ 'blocks', blockName, ...presetPath ] ),\n\t\tget( features, presetPath ),\n\t];\n\n\tfor ( const presetByOrigin of orderedPresetsByOrigin ) {\n\t\tif ( presetByOrigin ) {\n\t\t\t// Preset origins ordered by priority.\n\t\t\tconst origins = [ 'custom', 'theme', 'default' ];\n\t\t\tfor ( const origin of origins ) {\n\t\t\t\tconst presets = presetByOrigin[ origin ];\n\t\t\t\tif ( presets ) {\n\t\t\t\t\tconst presetObject = presets.find(\n\t\t\t\t\t\t( preset ) =>\n\t\t\t\t\t\t\tpreset[ presetProperty ] === presetValueValue\n\t\t\t\t\t);\n\t\t\t\t\tif ( presetObject ) {\n\t\t\t\t\t\tif ( presetProperty === 'slug' ) {\n\t\t\t\t\t\t\treturn presetObject;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If there is a highest priority preset with the same slug but different value the preset we found was overwritten and should be ignored.\n\t\t\t\t\t\tconst highestPresetObjectWithSameSlug = findInPresetsBy(\n\t\t\t\t\t\t\tfeatures,\n\t\t\t\t\t\t\tblockName,\n\t\t\t\t\t\t\tpresetPath,\n\t\t\t\t\t\t\t'slug',\n\t\t\t\t\t\t\tpresetObject.slug\n\t\t\t\t\t\t);\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\thighestPresetObjectWithSameSlug[\n\t\t\t\t\t\t\t\tpresetProperty\n\t\t\t\t\t\t\t] === presetObject[ presetProperty ]\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\treturn presetObject;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn undefined;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n\nexport function getPresetVariableFromValue(\n\tfeatures,\n\tblockName,\n\tvariableStylePath,\n\tpresetPropertyValue\n) {\n\tif ( ! presetPropertyValue ) {\n\t\treturn presetPropertyValue;\n\t}\n\n\tconst cssVarInfix = STYLE_PATH_TO_CSS_VAR_INFIX[ variableStylePath ];\n\n\tconst metadata = PRESET_METADATA.find(\n\t\t( data ) => data.cssVarInfix === cssVarInfix\n\t);\n\n\tif ( ! metadata ) {\n\t\t// The property doesn't have preset data\n\t\t// so the value should be returned as it is.\n\t\treturn presetPropertyValue;\n\t}\n\tconst { valueKey, path } = metadata;\n\n\tconst presetObject = findInPresetsBy(\n\t\tfeatures,\n\t\tblockName,\n\t\tpath,\n\t\tvalueKey,\n\t\tpresetPropertyValue\n\t);\n\n\tif ( ! presetObject ) {\n\t\t// Value wasn't found in the presets,\n\t\t// so it must be a custom value.\n\t\treturn presetPropertyValue;\n\t}\n\n\treturn `var:preset|${ cssVarInfix }|${ presetObject.slug }`;\n}\n\nfunction getValueFromPresetVariable(\n\tfeatures,\n\tblockName,\n\tvariable,\n\t[ presetType, slug ]\n) {\n\tconst metadata = PRESET_METADATA.find(\n\t\t( data ) => data.cssVarInfix === presetType\n\t);\n\tif ( ! metadata ) {\n\t\treturn variable;\n\t}\n\n\tconst presetObject = findInPresetsBy(\n\t\tfeatures.settings,\n\t\tblockName,\n\t\tmetadata.path,\n\t\t'slug',\n\t\tslug\n\t);\n\n\tif ( presetObject ) {\n\t\tconst { valueKey } = metadata;\n\t\tconst result = presetObject[ valueKey ];\n\t\treturn getValueFromVariable( features, blockName, result );\n\t}\n\n\treturn variable;\n}\n\nfunction getValueFromCustomVariable( features, blockName, variable, path ) {\n\tconst result =\n\t\tget( features.settings, [ 'blocks', blockName, 'custom', ...path ] ) ??\n\t\tget( features.settings, [ 'custom', ...path ] );\n\tif ( ! result ) {\n\t\treturn variable;\n\t}\n\t// A variable may reference another variable so we need recursion until we find the value.\n\treturn getValueFromVariable( features, blockName, result );\n}\n\n/**\n * Attempts to fetch the value of a theme.json CSS variable.\n *\n * @param {Object}   features  GlobalStylesContext config, e.g., user, base or merged. Represents the theme.json tree.\n * @param {string}   blockName The name of a block as represented in the styles property. E.g., 'root' for root-level, and 'core/${blockName}' for blocks.\n * @param {string|*} variable  An incoming style value. A CSS var value is expected, but it could be any value.\n * @return {string|*|{ref}} The value of the CSS var, if found. If not found, the passed variable argument.\n */\nexport function getValueFromVariable( features, blockName, variable ) {\n\tif ( ! variable || typeof variable !== 'string' ) {\n\t\tif ( variable?.ref && typeof variable?.ref === 'string' ) {\n\t\t\tconst refPath = variable.ref.split( '.' );\n\t\t\tvariable = get( features, refPath );\n\t\t\t// Presence of another ref indicates a reference to another dynamic value.\n\t\t\t// Pointing to another dynamic value is not supported.\n\t\t\tif ( ! variable || !! variable?.ref ) {\n\t\t\t\treturn variable;\n\t\t\t}\n\t\t} else {\n\t\t\treturn variable;\n\t\t}\n\t}\n\tconst USER_VALUE_PREFIX = 'var:';\n\tconst THEME_VALUE_PREFIX = 'var(--wp--';\n\tconst THEME_VALUE_SUFFIX = ')';\n\n\tlet parsedVar;\n\n\tif ( variable.startsWith( USER_VALUE_PREFIX ) ) {\n\t\tparsedVar = variable.slice( USER_VALUE_PREFIX.length ).split( '|' );\n\t} else if (\n\t\tvariable.startsWith( THEME_VALUE_PREFIX ) &&\n\t\tvariable.endsWith( THEME_VALUE_SUFFIX )\n\t) {\n\t\tparsedVar = variable\n\t\t\t.slice( THEME_VALUE_PREFIX.length, -THEME_VALUE_SUFFIX.length )\n\t\t\t.split( '--' );\n\t} else {\n\t\t// We don't know how to parse the value: either is raw of uses complex CSS such as `calc(1px * var(--wp--variable) )`\n\t\treturn variable;\n\t}\n\n\tconst [ type, ...path ] = parsedVar;\n\tif ( type === 'preset' ) {\n\t\treturn getValueFromPresetVariable(\n\t\t\tfeatures,\n\t\t\tblockName,\n\t\t\tvariable,\n\t\t\tpath\n\t\t);\n\t}\n\tif ( type === 'custom' ) {\n\t\treturn getValueFromCustomVariable(\n\t\t\tfeatures,\n\t\t\tblockName,\n\t\t\tvariable,\n\t\t\tpath\n\t\t);\n\t}\n\treturn variable;\n}\n\n/**\n * Function that scopes a selector with another one. This works a bit like\n * SCSS nesting except the `&` operator isn't supported.\n *\n * @example\n * ```js\n * const scope = '.a, .b .c';\n * const selector = '> .x, .y';\n * const merged = scopeSelector( scope, selector );\n * // merged is '.a > .x, .a .y, .b .c > .x, .b .c .y'\n * ```\n *\n * @param {string} scope    Selector to scope to.\n * @param {string} selector Original selector.\n *\n * @return {string} Scoped selector.\n */\nexport function scopeSelector( scope, selector ) {\n\tconst scopes = scope.split( ',' );\n\tconst selectors = selector.split( ',' );\n\n\tconst selectorsScoped = [];\n\tscopes.forEach( ( outer ) => {\n\t\tselectors.forEach( ( inner ) => {\n\t\t\tselectorsScoped.push( `${ outer.trim() } ${ inner.trim() }` );\n\t\t} );\n\t} );\n\n\treturn selectorsScoped.join( ', ' );\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/utils.js"],"names":["ROOT_BLOCK_NAME","ROOT_BLOCK_SELECTOR","ROOT_BLOCK_SUPPORTS","PRESET_METADATA","path","valueKey","cssVarInfix","classes","classSuffix","propertyName","valueFunc","slug","preset","typography","typographySettings","size","STYLE_PATH_TO_CSS_VAR_INFIX","STYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE","findInPresetsBy","features","blockName","presetPath","presetProperty","presetValueValue","orderedPresetsByOrigin","presetByOrigin","origins","origin","presets","presetObject","find","highestPresetObjectWithSameSlug","undefined","getPresetVariableFromValue","variableStylePath","presetPropertyValue","metadata","data","getValueFromPresetVariable","variable","presetType","settings","result","getValueFromVariable","getValueFromCustomVariable","ref","refPath","split","USER_VALUE_PREFIX","THEME_VALUE_PREFIX","THEME_VALUE_SUFFIX","parsedVar","startsWith","slice","length","endsWith","type","scopeSelector","scope","selector","scopes","selectors","selectorsScoped","forEach","outer","inner","push","trim","join"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { get } from 'lodash';\n\n/**\n * Internal dependencies\n */\nimport { getTypographyFontSizeValue } from './typography-utils';\n\n/* Supporting data. */\nexport const ROOT_BLOCK_NAME = 'root';\nexport const ROOT_BLOCK_SELECTOR = 'body';\nexport const ROOT_BLOCK_SUPPORTS = [\n\t'background',\n\t'backgroundColor',\n\t'color',\n\t'linkColor',\n\t'buttonColor',\n\t'fontFamily',\n\t'fontSize',\n\t'fontStyle',\n\t'fontWeight',\n\t'lineHeight',\n\t'textDecoration',\n\t'textTransform',\n\t'padding',\n];\n\nexport const PRESET_METADATA = [\n\t{\n\t\tpath: [ 'color', 'palette' ],\n\t\tvalueKey: 'color',\n\t\tcssVarInfix: 'color',\n\t\tclasses: [\n\t\t\t{ classSuffix: 'color', propertyName: 'color' },\n\t\t\t{\n\t\t\t\tclassSuffix: 'background-color',\n\t\t\t\tpropertyName: 'background-color',\n\t\t\t},\n\t\t\t{\n\t\t\t\tclassSuffix: 'border-color',\n\t\t\t\tpropertyName: 'border-color',\n\t\t\t},\n\t\t],\n\t},\n\t{\n\t\tpath: [ 'color', 'gradients' ],\n\t\tvalueKey: 'gradient',\n\t\tcssVarInfix: 'gradient',\n\t\tclasses: [\n\t\t\t{\n\t\t\t\tclassSuffix: 'gradient-background',\n\t\t\t\tpropertyName: 'background',\n\t\t\t},\n\t\t],\n\t},\n\t{\n\t\tpath: [ 'color', 'duotone' ],\n\t\tcssVarInfix: 'duotone',\n\t\tvalueFunc: ( { slug } ) => `url( '#wp-duotone-${ slug }' )`,\n\t\tclasses: [],\n\t},\n\t{\n\t\tpath: [ 'typography', 'fontSizes' ],\n\t\tvalueFunc: ( preset, { typography: typographySettings } ) =>\n\t\t\tgetTypographyFontSizeValue( preset, typographySettings ),\n\t\tvalueKey: 'size',\n\t\tcssVarInfix: 'font-size',\n\t\tclasses: [ { classSuffix: 'font-size', propertyName: 'font-size' } ],\n\t},\n\t{\n\t\tpath: [ 'typography', 'fontFamilies' ],\n\t\tvalueKey: 'fontFamily',\n\t\tcssVarInfix: 'font-family',\n\t\tclasses: [\n\t\t\t{ classSuffix: 'font-family', propertyName: 'font-family' },\n\t\t],\n\t},\n\t{\n\t\tpath: [ 'spacing', 'spacingSizes' ],\n\t\tvalueKey: 'size',\n\t\tcssVarInfix: 'spacing',\n\t\tvalueFunc: ( { size } ) => size,\n\t\tclasses: [],\n\t},\n];\n\nexport const STYLE_PATH_TO_CSS_VAR_INFIX = {\n\t'color.background': 'color',\n\t'color.text': 'color',\n\t'elements.link.color.text': 'color',\n\t'elements.button.color.text': 'color',\n\t'elements.button.backgroundColor': 'background-color',\n\t'elements.heading.color': 'color',\n\t'elements.heading.backgroundColor': 'background-color',\n\t'elements.heading.gradient': 'gradient',\n\t'color.gradient': 'gradient',\n\t'typography.fontSize': 'font-size',\n\t'typography.fontFamily': 'font-family',\n};\n\n// A static list of block attributes that store global style preset slugs.\nexport const STYLE_PATH_TO_PRESET_BLOCK_ATTRIBUTE = {\n\t'color.background': 'backgroundColor',\n\t'color.text': 'textColor',\n\t'color.gradient': 'gradient',\n\t'typography.fontSize': 'fontSize',\n\t'typography.fontFamily': 'fontFamily',\n};\n\nfunction findInPresetsBy(\n\tfeatures,\n\tblockName,\n\tpresetPath,\n\tpresetProperty,\n\tpresetValueValue\n) {\n\t// Block presets take priority above root level presets.\n\tconst orderedPresetsByOrigin = [\n\t\tget( features, [ 'blocks', blockName, ...presetPath ] ),\n\t\tget( features, presetPath ),\n\t];\n\n\tfor ( const presetByOrigin of orderedPresetsByOrigin ) {\n\t\tif ( presetByOrigin ) {\n\t\t\t// Preset origins ordered by priority.\n\t\t\tconst origins = [ 'custom', 'theme', 'default' ];\n\t\t\tfor ( const origin of origins ) {\n\t\t\t\tconst presets = presetByOrigin[ origin ];\n\t\t\t\tif ( presets ) {\n\t\t\t\t\tconst presetObject = presets.find(\n\t\t\t\t\t\t( preset ) =>\n\t\t\t\t\t\t\tpreset[ presetProperty ] === presetValueValue\n\t\t\t\t\t);\n\t\t\t\t\tif ( presetObject ) {\n\t\t\t\t\t\tif ( presetProperty === 'slug' ) {\n\t\t\t\t\t\t\treturn presetObject;\n\t\t\t\t\t\t}\n\t\t\t\t\t\t// If there is a highest priority preset with the same slug but different value the preset we found was overwritten and should be ignored.\n\t\t\t\t\t\tconst highestPresetObjectWithSameSlug = findInPresetsBy(\n\t\t\t\t\t\t\tfeatures,\n\t\t\t\t\t\t\tblockName,\n\t\t\t\t\t\t\tpresetPath,\n\t\t\t\t\t\t\t'slug',\n\t\t\t\t\t\t\tpresetObject.slug\n\t\t\t\t\t\t);\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\thighestPresetObjectWithSameSlug[\n\t\t\t\t\t\t\t\tpresetProperty\n\t\t\t\t\t\t\t] === presetObject[ presetProperty ]\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\treturn presetObject;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn undefined;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}\n\nexport function getPresetVariableFromValue(\n\tfeatures,\n\tblockName,\n\tvariableStylePath,\n\tpresetPropertyValue\n) {\n\tif ( ! presetPropertyValue ) {\n\t\treturn presetPropertyValue;\n\t}\n\n\tconst cssVarInfix = STYLE_PATH_TO_CSS_VAR_INFIX[ variableStylePath ];\n\n\tconst metadata = PRESET_METADATA.find(\n\t\t( data ) => data.cssVarInfix === cssVarInfix\n\t);\n\n\tif ( ! metadata ) {\n\t\t// The property doesn't have preset data\n\t\t// so the value should be returned as it is.\n\t\treturn presetPropertyValue;\n\t}\n\tconst { valueKey, path } = metadata;\n\n\tconst presetObject = findInPresetsBy(\n\t\tfeatures,\n\t\tblockName,\n\t\tpath,\n\t\tvalueKey,\n\t\tpresetPropertyValue\n\t);\n\n\tif ( ! presetObject ) {\n\t\t// Value wasn't found in the presets,\n\t\t// so it must be a custom value.\n\t\treturn presetPropertyValue;\n\t}\n\n\treturn `var:preset|${ cssVarInfix }|${ presetObject.slug }`;\n}\n\nfunction getValueFromPresetVariable(\n\tfeatures,\n\tblockName,\n\tvariable,\n\t[ presetType, slug ]\n) {\n\tconst metadata = PRESET_METADATA.find(\n\t\t( data ) => data.cssVarInfix === presetType\n\t);\n\tif ( ! metadata ) {\n\t\treturn variable;\n\t}\n\n\tconst presetObject = findInPresetsBy(\n\t\tfeatures.settings,\n\t\tblockName,\n\t\tmetadata.path,\n\t\t'slug',\n\t\tslug\n\t);\n\n\tif ( presetObject ) {\n\t\tconst { valueKey } = metadata;\n\t\tconst result = presetObject[ valueKey ];\n\t\treturn getValueFromVariable( features, blockName, result );\n\t}\n\n\treturn variable;\n}\n\nfunction getValueFromCustomVariable( features, blockName, variable, path ) {\n\tconst result =\n\t\tget( features.settings, [ 'blocks', blockName, 'custom', ...path ] ) ??\n\t\tget( features.settings, [ 'custom', ...path ] );\n\tif ( ! result ) {\n\t\treturn variable;\n\t}\n\t// A variable may reference another variable so we need recursion until we find the value.\n\treturn getValueFromVariable( features, blockName, result );\n}\n\n/**\n * Attempts to fetch the value of a theme.json CSS variable.\n *\n * @param {Object}   features  GlobalStylesContext config, e.g., user, base or merged. Represents the theme.json tree.\n * @param {string}   blockName The name of a block as represented in the styles property. E.g., 'root' for root-level, and 'core/${blockName}' for blocks.\n * @param {string|*} variable  An incoming style value. A CSS var value is expected, but it could be any value.\n * @return {string|*|{ref}} The value of the CSS var, if found. If not found, the passed variable argument.\n */\nexport function getValueFromVariable( features, blockName, variable ) {\n\tif ( ! variable || typeof variable !== 'string' ) {\n\t\tif ( variable?.ref && typeof variable?.ref === 'string' ) {\n\t\t\tconst refPath = variable.ref.split( '.' );\n\t\t\tvariable = get( features, refPath );\n\t\t\t// Presence of another ref indicates a reference to another dynamic value.\n\t\t\t// Pointing to another dynamic value is not supported.\n\t\t\tif ( ! variable || !! variable?.ref ) {\n\t\t\t\treturn variable;\n\t\t\t}\n\t\t} else {\n\t\t\treturn variable;\n\t\t}\n\t}\n\tconst USER_VALUE_PREFIX = 'var:';\n\tconst THEME_VALUE_PREFIX = 'var(--wp--';\n\tconst THEME_VALUE_SUFFIX = ')';\n\n\tlet parsedVar;\n\n\tif ( variable.startsWith( USER_VALUE_PREFIX ) ) {\n\t\tparsedVar = variable.slice( USER_VALUE_PREFIX.length ).split( '|' );\n\t} else if (\n\t\tvariable.startsWith( THEME_VALUE_PREFIX ) &&\n\t\tvariable.endsWith( THEME_VALUE_SUFFIX )\n\t) {\n\t\tparsedVar = variable\n\t\t\t.slice( THEME_VALUE_PREFIX.length, -THEME_VALUE_SUFFIX.length )\n\t\t\t.split( '--' );\n\t} else {\n\t\t// We don't know how to parse the value: either is raw of uses complex CSS such as `calc(1px * var(--wp--variable) )`\n\t\treturn variable;\n\t}\n\n\tconst [ type, ...path ] = parsedVar;\n\tif ( type === 'preset' ) {\n\t\treturn getValueFromPresetVariable(\n\t\t\tfeatures,\n\t\t\tblockName,\n\t\t\tvariable,\n\t\t\tpath\n\t\t);\n\t}\n\tif ( type === 'custom' ) {\n\t\treturn getValueFromCustomVariable(\n\t\t\tfeatures,\n\t\t\tblockName,\n\t\t\tvariable,\n\t\t\tpath\n\t\t);\n\t}\n\treturn variable;\n}\n\n/**\n * Function that scopes a selector with another one. This works a bit like\n * SCSS nesting except the `&` operator isn't supported.\n *\n * @example\n * ```js\n * const scope = '.a, .b .c';\n * const selector = '> .x, .y';\n * const merged = scopeSelector( scope, selector );\n * // merged is '.a > .x, .a .y, .b .c > .x, .b .c .y'\n * ```\n *\n * @param {string} scope    Selector to scope to.\n * @param {string} selector Original selector.\n *\n * @return {string} Scoped selector.\n */\nexport function scopeSelector( scope, selector ) {\n\tconst scopes = scope.split( ',' );\n\tconst selectors = selector.split( ',' );\n\n\tconst selectorsScoped = [];\n\tscopes.forEach( ( outer ) => {\n\t\tselectors.forEach( ( inner ) => {\n\t\t\tselectorsScoped.push( `${ outer.trim() } ${ inner.trim() }` );\n\t\t} );\n\t} );\n\n\treturn selectorsScoped.join( ', ' );\n}\n"]}

package/build/components/header-edit-mode/document-actions/index.js

@@ -23,17 +23,11 @@ var _icons = require("@wordpress/icons");
 
 var _blockEditor = require("@wordpress/block-editor");
 
-var _coreData = require("@wordpress/core-data");
-
-var _editor = require("@wordpress/editor");
-
 var _preferences = require("@wordpress/preferences");
 
-var _htmlEntities = require("@wordpress/html-entities");
-
 var _templateDetails = _interopRequireDefault(require("../../template-details"));
 
-var _store = require("../../../store");
+var _useEditedEntityRecord = _interopRequireDefault(require("../../use-edited-entity-record"));
 
 /**
  * External dependencies
@@ -74,38 +68,12 @@ function useSecondaryText() {
 }
 
 function DocumentActions() {
+  const showIconLabels = (0, _data.useSelect)(select => select(_preferences.store).get('core/edit-site', 'showIconLabels'), []);
   const {
-    showIconLabels,
-    entityTitle,
-    template,
-    templateType,
-    isLoaded
-  } = (0, _data.useSelect)(select => {
-    const {
-      getEditedPostType,
-      getEditedPostId
-    } = select(_store.store);
-    const {
-      getEditedEntityRecord
-    } = select(_coreData.store);
-    const {
-      __experimentalGetTemplateInfo: getTemplateInfo
-    } = select(_editor.store);
-    const postType = getEditedPostType();
-    const postId = getEditedPostId();
-    const record = getEditedEntityRecord('postType', postType, postId);
-
-    const _isLoaded = !!postId;
-
-    return {
-      showIconLabels: select(_preferences.store).get('core/edit-site', 'showIconLabels'),
-      entityTitle: getTemplateInfo(record).title,
-      isLoaded: _isLoaded,
-      template: record,
-      templateType: postType
-    };
-  }, []);
-  const entityLabel = templateType === 'wp_template_part' ? 'template part' : 'template';
+    isLoaded,
+    record,
+    getTitle
+  } = (0, _useEditedEntityRecord.default)();
   const {
     label,
     icon
@@ -127,12 +95,13 @@ function DocumentActions() {
   } // Return feedback that the template does not seem to exist.
 
 
-  if (!entityTitle) {
+  if (!record) {
     return (0, _element.createElement)("div", {
       className: "edit-site-document-actions"
     }, (0, _i18n.__)('Template not found'));
   }
 
+  const entityLabel = record.type === 'wp_template_part' ? (0, _i18n.__)('template part') : (0, _i18n.__)('template');
   return (0, _element.createElement)("div", {
     className: (0, _classnames.default)('edit-site-document-actions', {
       'has-secondary-label': !!label
@@ -148,7 +117,7 @@ function DocumentActions() {
     as: "span"
   }, (0, _i18n.sprintf)(
   /* translators: %s: the entity being edited, like "template"*/
-  (0, _i18n.__)('Editing %s: '), entityLabel)), (0, _htmlEntities.decodeEntities)(entityTitle)), (0, _element.createElement)("div", {
+  (0, _i18n.__)('Editing %s: '), entityLabel)), getTitle()), (0, _element.createElement)("div", {
     className: "edit-site-document-actions__secondary-item"
   }, (0, _element.createElement)(_blockEditor.BlockIcon, {
     icon: icon,
@@ -181,7 +150,7 @@ function DocumentActions() {
         onClose
       } = _ref2;
       return (0, _element.createElement)(_templateDetails.default, {
-        template: template,
+        template: record,
         onClose: onClose
       });
     }

package/build/components/header-edit-mode/document-actions/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/header-edit-mode/document-actions/index.js"],"names":["getBlockDisplayText","block","blockType","name","attributes","useSecondaryText","getBlock","blockEditorStore","activeEntityBlockId","select","__experimentalGetActiveBlockIdByBlockNames","blockInformation","label","isActive","icon","DocumentActions","showIconLabels","entityTitle","template","templateType","isLoaded","getEditedPostType","getEditedPostId","editSiteStore","getEditedEntityRecord","coreStore","__experimentalGetTemplateInfo","getTemplateInfo","editorStore","postType","postId","record","_isLoaded","preferencesStore","get","title","entityLabel","popoverAnchor","setPopoverAnchor","popoverProps","anchor","isOpen","onToggle","chevronDown","undefined","onClose"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { sprintf, __ } from '@wordpress/i18n';\nimport {\n\t__experimentalGetBlockLabel as getBlockLabel,\n\tgetBlockType,\n} from '@wordpress/blocks';\nimport { useSelect } from '@wordpress/data';\nimport {\n\tDropdown,\n\tButton,\n\tVisuallyHidden,\n\t__experimentalText as Text,\n} from '@wordpress/components';\nimport { chevronDown } from '@wordpress/icons';\nimport { useState, useMemo } from '@wordpress/element';\nimport {\n\tstore as blockEditorStore,\n\tuseBlockDisplayInformation,\n\tBlockIcon,\n} from '@wordpress/block-editor';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { store as editorStore } from '@wordpress/editor';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { decodeEntities } from '@wordpress/html-entities';\n\n/**\n * Internal dependencies\n */\nimport TemplateDetails from '../../template-details';\nimport { store as editSiteStore } from '../../../store';\n\nfunction getBlockDisplayText( block ) {\n\tif ( block ) {\n\t\tconst blockType = getBlockType( block.name );\n\t\treturn blockType ? getBlockLabel( blockType, block.attributes ) : null;\n\t}\n\treturn null;\n}\n\nfunction useSecondaryText() {\n\tconst { getBlock } = useSelect( blockEditorStore );\n\tconst activeEntityBlockId = useSelect(\n\t\t( select ) =>\n\t\t\tselect(\n\t\t\t\tblockEditorStore\n\t\t\t).__experimentalGetActiveBlockIdByBlockNames( [\n\t\t\t\t'core/template-part',\n\t\t\t] ),\n\t\t[]\n\t);\n\n\tconst blockInformation = useBlockDisplayInformation( activeEntityBlockId );\n\n\tif ( activeEntityBlockId ) {\n\t\treturn {\n\t\t\tlabel: getBlockDisplayText( getBlock( activeEntityBlockId ) ),\n\t\t\tisActive: true,\n\t\t\ticon: blockInformation?.icon,\n\t\t};\n\t}\n\n\treturn {};\n}\n\nexport default function DocumentActions() {\n\tconst { showIconLabels, entityTitle, template, templateType, isLoaded } =\n\t\tuseSelect( ( select ) => {\n\t\t\tconst { getEditedPostType, getEditedPostId } =\n\t\t\t\tselect( editSiteStore );\n\t\t\tconst { getEditedEntityRecord } = select( coreStore );\n\t\t\tconst { __experimentalGetTemplateInfo: getTemplateInfo } =\n\t\t\t\tselect( editorStore );\n\t\t\tconst postType = getEditedPostType();\n\t\t\tconst postId = getEditedPostId();\n\t\t\tconst record = getEditedEntityRecord(\n\t\t\t\t'postType',\n\t\t\t\tpostType,\n\t\t\t\tpostId\n\t\t\t);\n\t\t\tconst _isLoaded = !! postId;\n\n\t\t\treturn {\n\t\t\t\tshowIconLabels: select( preferencesStore ).get(\n\t\t\t\t\t'core/edit-site',\n\t\t\t\t\t'showIconLabels'\n\t\t\t\t),\n\t\t\t\tentityTitle: getTemplateInfo( record ).title,\n\t\t\t\tisLoaded: _isLoaded,\n\t\t\t\ttemplate: record,\n\t\t\t\ttemplateType: postType,\n\t\t\t};\n\t\t}, [] );\n\n\tconst entityLabel =\n\t\ttemplateType === 'wp_template_part' ? 'template part' : 'template';\n\tconst { label, icon } = useSecondaryText();\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState( null );\n\n\t// Memoize popoverProps to avoid returning a new object every time.\n\tconst popoverProps = useMemo(\n\t\t() => ( {\n\t\t\t// Use the title wrapper as the popover anchor so that the dropdown is\n\t\t\t// centered over the whole title area rather than just one part of it.\n\t\t\tanchor: popoverAnchor,\n\t\t} ),\n\t\t[ popoverAnchor ]\n\t);\n\n\t// Return a simple loading indicator until we have information to show.\n\tif ( ! isLoaded ) {\n\t\treturn (\n\t\t\t<div className=\"edit-site-document-actions\">\n\t\t\t\t{ __( 'Loading…' ) }\n\t\t\t</div>\n\t\t);\n\t}\n\n\t// Return feedback that the template does not seem to exist.\n\tif ( ! entityTitle ) {\n\t\treturn (\n\t\t\t<div className=\"edit-site-document-actions\">\n\t\t\t\t{ __( 'Template not found' ) }\n\t\t\t</div>\n\t\t);\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames( 'edit-site-document-actions', {\n\t\t\t\t'has-secondary-label': !! label,\n\t\t\t} ) }\n\t\t>\n\t\t\t<div\n\t\t\t\tref={ setPopoverAnchor }\n\t\t\t\tclassName=\"edit-site-document-actions__title-wrapper\"\n\t\t\t>\n\t\t\t\t<Text\n\t\t\t\t\tsize=\"body\"\n\t\t\t\t\tclassName=\"edit-site-document-actions__title\"\n\t\t\t\t\tas=\"h1\"\n\t\t\t\t>\n\t\t\t\t\t<VisuallyHidden as=\"span\">\n\t\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t\t/* translators: %s: the entity being edited, like \"template\"*/\n\t\t\t\t\t\t\t__( 'Editing %s: ' ),\n\t\t\t\t\t\t\tentityLabel\n\t\t\t\t\t\t) }\n\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t{ decodeEntities( entityTitle ) }\n\t\t\t\t</Text>\n\t\t\t\t<div className=\"edit-site-document-actions__secondary-item\">\n\t\t\t\t\t<BlockIcon icon={ icon } showColors />\n\t\t\t\t\t<Text size=\"body\">{ label ?? '' }</Text>\n\t\t\t\t</div>\n\n\t\t\t\t<Dropdown\n\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\tposition=\"bottom center\"\n\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"edit-site-document-actions__get-info\"\n\t\t\t\t\t\t\ticon={ chevronDown }\n\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\tvariant={ showIconLabels ? 'tertiary' : undefined }\n\t\t\t\t\t\t\tlabel={ sprintf(\n\t\t\t\t\t\t\t\t/* translators: %s: the entity to see details about, like \"template\"*/\n\t\t\t\t\t\t\t\t__( 'Show %s details' ),\n\t\t\t\t\t\t\t\tentityLabel\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ showIconLabels && __( 'Details' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t\tcontentClassName=\"edit-site-document-actions__info-dropdown\"\n\t\t\t\t\trenderContent={ ( { onClose } ) => (\n\t\t\t\t\t\t<TemplateDetails\n\t\t\t\t\t\t\ttemplate={ template }\n\t\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/header-edit-mode/document-actions/index.js"],"names":["getBlockDisplayText","block","blockType","name","attributes","useSecondaryText","getBlock","blockEditorStore","activeEntityBlockId","select","__experimentalGetActiveBlockIdByBlockNames","blockInformation","label","isActive","icon","DocumentActions","showIconLabels","preferencesStore","get","isLoaded","record","getTitle","popoverAnchor","setPopoverAnchor","popoverProps","anchor","entityLabel","type","isOpen","onToggle","chevronDown","undefined","onClose"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { sprintf, __ } from '@wordpress/i18n';\nimport {\n\t__experimentalGetBlockLabel as getBlockLabel,\n\tgetBlockType,\n} from '@wordpress/blocks';\nimport { useSelect } from '@wordpress/data';\nimport {\n\tDropdown,\n\tButton,\n\tVisuallyHidden,\n\t__experimentalText as Text,\n} from '@wordpress/components';\nimport { chevronDown } from '@wordpress/icons';\nimport { useState, useMemo } from '@wordpress/element';\nimport {\n\tstore as blockEditorStore,\n\tuseBlockDisplayInformation,\n\tBlockIcon,\n} from '@wordpress/block-editor';\nimport { store as preferencesStore } from '@wordpress/preferences';\n\n/**\n * Internal dependencies\n */\nimport TemplateDetails from '../../template-details';\nimport useEditedEntityRecord from '../../use-edited-entity-record';\n\nfunction getBlockDisplayText( block ) {\n\tif ( block ) {\n\t\tconst blockType = getBlockType( block.name );\n\t\treturn blockType ? getBlockLabel( blockType, block.attributes ) : null;\n\t}\n\treturn null;\n}\n\nfunction useSecondaryText() {\n\tconst { getBlock } = useSelect( blockEditorStore );\n\tconst activeEntityBlockId = useSelect(\n\t\t( select ) =>\n\t\t\tselect(\n\t\t\t\tblockEditorStore\n\t\t\t).__experimentalGetActiveBlockIdByBlockNames( [\n\t\t\t\t'core/template-part',\n\t\t\t] ),\n\t\t[]\n\t);\n\n\tconst blockInformation = useBlockDisplayInformation( activeEntityBlockId );\n\n\tif ( activeEntityBlockId ) {\n\t\treturn {\n\t\t\tlabel: getBlockDisplayText( getBlock( activeEntityBlockId ) ),\n\t\t\tisActive: true,\n\t\t\ticon: blockInformation?.icon,\n\t\t};\n\t}\n\n\treturn {};\n}\n\nexport default function DocumentActions() {\n\tconst showIconLabels = useSelect(\n\t\t( select ) =>\n\t\t\tselect( preferencesStore ).get(\n\t\t\t\t'core/edit-site',\n\t\t\t\t'showIconLabels'\n\t\t\t),\n\t\t[]\n\t);\n\tconst { isLoaded, record, getTitle } = useEditedEntityRecord();\n\tconst { label, icon } = useSecondaryText();\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState( null );\n\n\t// Memoize popoverProps to avoid returning a new object every time.\n\tconst popoverProps = useMemo(\n\t\t() => ( {\n\t\t\t// Use the title wrapper as the popover anchor so that the dropdown is\n\t\t\t// centered over the whole title area rather than just one part of it.\n\t\t\tanchor: popoverAnchor,\n\t\t} ),\n\t\t[ popoverAnchor ]\n\t);\n\n\t// Return a simple loading indicator until we have information to show.\n\tif ( ! isLoaded ) {\n\t\treturn (\n\t\t\t<div className=\"edit-site-document-actions\">\n\t\t\t\t{ __( 'Loading…' ) }\n\t\t\t</div>\n\t\t);\n\t}\n\n\t// Return feedback that the template does not seem to exist.\n\tif ( ! record ) {\n\t\treturn (\n\t\t\t<div className=\"edit-site-document-actions\">\n\t\t\t\t{ __( 'Template not found' ) }\n\t\t\t</div>\n\t\t);\n\t}\n\n\tconst entityLabel =\n\t\trecord.type === 'wp_template_part'\n\t\t\t? __( 'template part' )\n\t\t\t: __( 'template' );\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames( 'edit-site-document-actions', {\n\t\t\t\t'has-secondary-label': !! label,\n\t\t\t} ) }\n\t\t>\n\t\t\t<div\n\t\t\t\tref={ setPopoverAnchor }\n\t\t\t\tclassName=\"edit-site-document-actions__title-wrapper\"\n\t\t\t>\n\t\t\t\t<Text\n\t\t\t\t\tsize=\"body\"\n\t\t\t\t\tclassName=\"edit-site-document-actions__title\"\n\t\t\t\t\tas=\"h1\"\n\t\t\t\t>\n\t\t\t\t\t<VisuallyHidden as=\"span\">\n\t\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t\t/* translators: %s: the entity being edited, like \"template\"*/\n\t\t\t\t\t\t\t__( 'Editing %s: ' ),\n\t\t\t\t\t\t\tentityLabel\n\t\t\t\t\t\t) }\n\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t{ getTitle() }\n\t\t\t\t</Text>\n\t\t\t\t<div className=\"edit-site-document-actions__secondary-item\">\n\t\t\t\t\t<BlockIcon icon={ icon } showColors />\n\t\t\t\t\t<Text size=\"body\">{ label ?? '' }</Text>\n\t\t\t\t</div>\n\n\t\t\t\t<Dropdown\n\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\tposition=\"bottom center\"\n\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"edit-site-document-actions__get-info\"\n\t\t\t\t\t\t\ticon={ chevronDown }\n\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\tvariant={ showIconLabels ? 'tertiary' : undefined }\n\t\t\t\t\t\t\tlabel={ sprintf(\n\t\t\t\t\t\t\t\t/* translators: %s: the entity to see details about, like \"template\"*/\n\t\t\t\t\t\t\t\t__( 'Show %s details' ),\n\t\t\t\t\t\t\t\tentityLabel\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ showIconLabels && __( 'Details' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) }\n\t\t\t\t\tcontentClassName=\"edit-site-document-actions__info-dropdown\"\n\t\t\t\t\trenderContent={ ( { onClose } ) => (\n\t\t\t\t\t\t<TemplateDetails\n\t\t\t\t\t\t\ttemplate={ record }\n\t\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"]}

package/build/components/layout/index.js

@@ -21,11 +21,11 @@ var _compose = require("@wordpress/compose");
 
 var _i18n = require("@wordpress/i18n");
 
-var _blockEditor = require("@wordpress/block-editor");
-
 var _interface = require("@wordpress/interface");
 
-var _sidebar = require("../sidebar");
+var _keyboardShortcuts = require("@wordpress/keyboard-shortcuts");
+
+var _sidebar = _interopRequireDefault(require("../sidebar"));
 
 var _editor = _interopRequireDefault(require("../editor"));
 
@@ -41,12 +41,10 @@ var _getIsListPage = _interopRequireDefault(require("../../utils/get-is-list-pag
 
 var _headerEditMode = _interopRequireDefault(require("../header-edit-mode"));
 
-var _siteIcon = _interopRequireDefault(require("../site-icon"));
-
-var _siteTitle = _interopRequireDefault(require("../site-title"));
-
 var _useInitEditedEntityFromUrl = _interopRequireDefault(require("../sync-state-with-url/use-init-edited-entity-from-url"));
 
+var _siteHub = _interopRequireDefault(require("../site-hub"));
+
 /**
  * External dependencies
  */
@@ -73,17 +71,25 @@ function Layout(_ref) {
   const isEditorPage = !isListPage;
   const {
     canvasMode,
-    dashboardLink
-  } = (0, _data.useSelect)(select => ({
-    canvasMode: select(_store.store).__unstableGetCanvasMode(),
-    dashboardLink: select(_store.store).getSettings().__experimentalDashboardLink
-  }), []);
-  const {
-    __unstableSetCanvasMode
-  } = (0, _data.useDispatch)(_store.store);
-  const {
-    clearSelectedBlock
-  } = (0, _data.useDispatch)(_blockEditor.store);
+    previousShortcut,
+    nextShortcut
+  } = (0, _data.useSelect)(select => {
+    const {
+      getAllShortcutKeyCombinations
+    } = select(_keyboardShortcuts.store);
+    const {
+      __unstableGetCanvasMode
+    } = select(_store.store);
+    return {
+      canvasMode: __unstableGetCanvasMode(),
+      previousShortcut: getAllShortcutKeyCombinations('core/edit-site/previous-region'),
+      nextShortcut: getAllShortcutKeyCombinations('core/edit-site/next-region')
+    };
+  }, []);
+  const navigateRegionsProps = (0, _components.__unstableUseNavigateRegions)({
+    previous: previousShortcut,
+    next: nextShortcut
+  });
   const disableMotion = (0, _compose.useReducedMotion)();
   const isMobileViewport = (0, _compose.useViewportMatch)('medium', '<');
   const [isMobileCanvasVisible, setIsMobileCanvasVisible] = (0, _element.useState)(false);
@@ -91,8 +97,7 @@ function Layout(_ref) {
   const showSidebar = isMobileViewport && !isMobileCanvasVisible || !isMobileViewport && (canvasMode === 'view' || !isEditorPage);
   const showCanvas = isMobileViewport && isMobileCanvasVisible || !isMobileViewport;
   const showFrame = !isEditorPage || canvasMode === 'view' && !isMobileViewport;
-  const showEditButton = isEditorPage && isMobileViewport && canvasMode === 'view' && isMobileCanvasVisible;
-  const isBackToDashboardButton = !isMobileViewport && canvasMode === 'view' || isMobileViewport && !isMobileCanvasVisible; // Ideally this effect could be removed if we move the "isMobileCanvasVisible" into the store.
+  const isFullCanvas = isEditorPage && canvasMode === 'edit' && !isMobileViewport || isMobileCanvasVisible; // Ideally this effect could be removed if we move the "isMobileCanvasVisible" into the store.
 
   const [canvasResizer, canvasSize] = (0, _compose.useResizeObserver)();
   const [fullResizer, fullSize] = (0, _compose.useResizeObserver)();
@@ -105,79 +110,42 @@ function Layout(_ref) {
       setIsMobileCanvasVisible(true);
     }
   }, [canvasMode, isMobileViewport]);
-  const siteIconButtonProps = isBackToDashboardButton ? {
-    href: dashboardLink || 'index.php',
-    'aria-label': (0, _i18n.__)('Go back to the dashboard')
-  } : {
-    label: (0, _i18n.__)('Open Navigation Sidebar'),
-    onClick: () => {
-      clearSelectedBlock();
-      setIsMobileCanvasVisible(false);
-
-      __unstableSetCanvasMode('view');
-    }
-  };
-  return (0, _element.createElement)(_element.Fragment, null, fullResizer, (0, _element.createElement)("div", {
-    className: (0, _classnames.default)('edit-site-layout', {
-      'is-full-canvas': isEditorPage && canvasMode === 'edit' && !isMobileViewport || isMobileCanvasVisible
+  return (0, _element.createElement)(_element.Fragment, null, fullResizer, (0, _element.createElement)("div", (0, _extends2.default)({}, navigateRegionsProps, {
+    ref: navigateRegionsProps.ref,
+    className: (0, _classnames.default)('edit-site-layout', navigateRegionsProps.className, {
+      'is-full-canvas': isFullCanvas,
+      'is-edit-mode': canvasMode === 'edit'
     })
-  }, (0, _element.createElement)("div", {
-    className: "edit-site-layout__header"
-  }, (0, _element.createElement)("div", {
-    className: "edit-site-layout__logo"
-  }, (0, _element.createElement)(_components.Button, (0, _extends2.default)({}, siteIconButtonProps, {
-    className: "edit-site-layout__view-mode-toggle"
-  }), (0, _element.createElement)(_siteIcon.default, {
-    className: "edit-site-layout__view-mode-toggle-icon"
-  })), (0, _element.createElement)(_components.__unstableAnimatePresence, {
+  }), (0, _element.createElement)(_siteHub.default, {
+    className: "edit-site-layout__hub",
+    isMobileCanvasVisible: isMobileCanvasVisible,
+    setIsMobileCanvasVisible: setIsMobileCanvasVisible
+  }), (0, _element.createElement)(_components.__unstableAnimatePresence, {
     initial: false
-  }, (isBackToDashboardButton || showEditButton) && (0, _element.createElement)(_components.__unstableMotion.div, {
-    initial: {
-      opacity: 0
-    },
-    exit: {
-      opacity: 0
-    },
-    animate: {
-      opacity: 1
-    },
-    style: {
-      position: 'absolute',
-      left: 60
-    }
-  }, (0, _element.createElement)(_components.__experimentalHStack, null, isBackToDashboardButton && (0, _element.createElement)(_siteTitle.default, null), showEditButton && (0, _element.createElement)(_components.Button, {
-    className: "edit-site-layout__edit-button",
-    label: (0, _i18n.__)('Open the editor'),
-    onClick: () => {
-      __unstableSetCanvasMode('edit');
-    }
-  }, (0, _i18n.__)('Edit'))))), isMobileViewport && !isMobileCanvasVisible && (0, _element.createElement)(_components.Button, {
-    onClick: () => setIsMobileCanvasVisible(true),
-    style: {
-      position: 'fixed',
-      right: 0
-    }
-  }, (0, _i18n.__)('View Editor'))), (0, _element.createElement)(_components.__unstableAnimatePresence, null, isEditorPage && canvasMode === 'edit' && (0, _element.createElement)(_interface.NavigableRegion, {
+  }, isEditorPage && (canvasMode === 'edit' || isMobileCanvasVisible) && (0, _element.createElement)(_interface.NavigableRegion, {
+    className: "edit-site-layout__header",
+    ariaLabel: (0, _i18n.__)('Editor top bar'),
     as: _components.__unstableMotion.div,
-    initial: {
-      y: -60
-    },
     animate: {
       y: 0
     },
+    initial: {
+      y: '-100%'
+    },
     exit: {
-      y: -60
+      y: '-100%'
     },
     transition: {
       type: 'tween',
       duration: disableMotion ? 0 : ANIMATION_DURATION,
       ease: 'easeOut'
-    },
-    className: "edit-site-layout__editor-header",
-    ariaLabel: (0, _i18n.__)('Editor top bar')
-  }, (0, _element.createElement)(_headerEditMode.default, null)))), (0, _element.createElement)(_components.__unstableAnimatePresence, {
+    }
+  }, canvasMode === 'edit' && (0, _element.createElement)(_headerEditMode.default, null))), (0, _element.createElement)("div", {
+    className: "edit-site-layout__content"
+  }, (0, _element.createElement)(_components.__unstableAnimatePresence, {
     initial: false
-  }, showSidebar && (0, _element.createElement)(_components.__unstableMotion.div, {
+  }, showSidebar && (0, _element.createElement)(_interface.NavigableRegion, {
+    as: _components.__unstableMotion.div,
     initial: {
       opacity: 0
     },
@@ -192,8 +160,9 @@ function Layout(_ref) {
       duration: disableMotion ? 0 : ANIMATION_DURATION,
       ease: 'easeOut'
     },
-    className: "edit-site-layout__sidebar"
-  }, (0, _element.createElement)(_sidebar.Sidebar, null))), showCanvas && (0, _element.createElement)("div", {
+    className: "edit-site-layout__sidebar",
+    ariaLabel: (0, _i18n.__)('Navigation sidebar')
+  }, (0, _element.createElement)(_sidebar.default, null))), showCanvas && (0, _element.createElement)("div", {
     className: "edit-site-layout__canvas-container",
     style: {
       paddingTop: showFrame ? canvasPadding : 0,
@@ -226,6 +195,6 @@ function Layout(_ref) {
     }
   }, (0, _element.createElement)(_errorBoundary.default, {
     onError: onError
-  }, isEditorPage && (0, _element.createElement)(_editor.default, null), isListPage && (0, _element.createElement)(_list.default, null)))))));
+  }, isEditorPage && (0, _element.createElement)(_editor.default, null), isListPage && (0, _element.createElement)(_list.default, null))))))));
 }
 //# sourceMappingURL=index.js.map

package/build/components/layout/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/layout/index.js"],"names":["ANIMATION_DURATION","Layout","onError","params","isListPage","isEditorPage","canvasMode","dashboardLink","select","editSiteStore","__unstableGetCanvasMode","getSettings","__experimentalDashboardLink","__unstableSetCanvasMode","clearSelectedBlock","blockEditorStore","disableMotion","isMobileViewport","isMobileCanvasVisible","setIsMobileCanvasVisible","canvasPadding","showSidebar","showCanvas","showFrame","showEditButton","isBackToDashboardButton","canvasResizer","canvasSize","fullResizer","fullSize","siteIconButtonProps","href","label","onClick","opacity","position","left","right","motion","div","y","type","duration","ease","paddingTop","paddingBottom","width","top","bottom"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport {\n\tButton,\n\t__experimentalHStack as HStack,\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '@wordpress/components';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tuseResizeObserver,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\nimport { useState, useEffect } from '@wordpress/element';\nimport { NavigableRegion } from '@wordpress/interface';\n\n/**\n * Internal dependencies\n */\nimport { Sidebar } from '../sidebar';\nimport Editor from '../editor';\nimport ListPage from '../list';\nimport ErrorBoundary from '../error-boundary';\nimport { store as editSiteStore } from '../../store';\nimport { useLocation } from '../routes';\nimport getIsListPage from '../../utils/get-is-list-page';\nimport Header from '../header-edit-mode';\nimport SiteIcon from '../site-icon';\nimport SiteTitle from '../site-title';\nimport useInitEditedEntityFromURL from '../sync-state-with-url/use-init-edited-entity-from-url';\n\nconst ANIMATION_DURATION = 0.5;\n\nexport default function Layout( { onError } ) {\n\t// This ensures the edited entity id and type are initialized properly.\n\tuseInitEditedEntityFromURL();\n\n\tconst { params } = useLocation();\n\tconst isListPage = getIsListPage( params );\n\tconst isEditorPage = ! isListPage;\n\tconst { canvasMode, dashboardLink } = useSelect(\n\t\t( select ) => ( {\n\t\t\tcanvasMode: select( editSiteStore ).__unstableGetCanvasMode(),\n\t\t\tdashboardLink:\n\t\t\t\tselect( editSiteStore ).getSettings()\n\t\t\t\t\t.__experimentalDashboardLink,\n\t\t} ),\n\t\t[]\n\t);\n\tconst { __unstableSetCanvasMode } = useDispatch( editSiteStore );\n\tconst { clearSelectedBlock } = useDispatch( blockEditorStore );\n\tconst disableMotion = useReducedMotion();\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst [ isMobileCanvasVisible, setIsMobileCanvasVisible ] =\n\t\tuseState( false );\n\tconst canvasPadding = isMobileViewport ? 0 : 24;\n\tconst showSidebar =\n\t\t( isMobileViewport && ! isMobileCanvasVisible ) ||\n\t\t( ! isMobileViewport && ( canvasMode === 'view' || ! isEditorPage ) );\n\tconst showCanvas =\n\t\t( isMobileViewport && isMobileCanvasVisible ) || ! isMobileViewport;\n\tconst showFrame =\n\t\t! isEditorPage || ( canvasMode === 'view' && ! isMobileViewport );\n\tconst showEditButton =\n\t\tisEditorPage &&\n\t\tisMobileViewport &&\n\t\tcanvasMode === 'view' &&\n\t\tisMobileCanvasVisible;\n\tconst isBackToDashboardButton =\n\t\t( ! isMobileViewport && canvasMode === 'view' ) ||\n\t\t( isMobileViewport && ! isMobileCanvasVisible );\n\t// Ideally this effect could be removed if we move the \"isMobileCanvasVisible\" into the store.\n\tconst [ canvasResizer, canvasSize ] = useResizeObserver();\n\tconst [ fullResizer, fullSize ] = useResizeObserver();\n\tuseEffect( () => {\n\t\tif ( canvasMode === 'view' && isMobileViewport ) {\n\t\t\tsetIsMobileCanvasVisible( false );\n\t\t}\n\n\t\tif ( canvasMode === 'edit' && isMobileViewport ) {\n\t\t\tsetIsMobileCanvasVisible( true );\n\t\t}\n\t}, [ canvasMode, isMobileViewport ] );\n\tconst siteIconButtonProps = isBackToDashboardButton\n\t\t? {\n\t\t\t\thref: dashboardLink || 'index.php',\n\t\t\t\t'aria-label': __( 'Go back to the dashboard' ),\n\t\t  }\n\t\t: {\n\t\t\t\tlabel: __( 'Open Navigation Sidebar' ),\n\t\t\t\tonClick: () => {\n\t\t\t\t\tclearSelectedBlock();\n\t\t\t\t\tsetIsMobileCanvasVisible( false );\n\t\t\t\t\t__unstableSetCanvasMode( 'view' );\n\t\t\t\t},\n\t\t  };\n\n\treturn (\n\t\t<>\n\t\t\t{ fullResizer }\n\t\t\t<div\n\t\t\t\tclassName={ classnames( 'edit-site-layout', {\n\t\t\t\t\t'is-full-canvas':\n\t\t\t\t\t\t( isEditorPage &&\n\t\t\t\t\t\t\tcanvasMode === 'edit' &&\n\t\t\t\t\t\t\t! isMobileViewport ) ||\n\t\t\t\t\t\tisMobileCanvasVisible,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t<div className=\"edit-site-layout__header\">\n\t\t\t\t\t<div className=\"edit-site-layout__logo\">\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t{ ...siteIconButtonProps }\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__view-mode-toggle\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<SiteIcon className=\"edit-site-layout__view-mode-toggle-icon\" />\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t\t\t{ ( isBackToDashboardButton || showEditButton ) && (\n\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\tinitial={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\texit={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\tanimate={ { opacity: 1 } }\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\t\t\tleft: 60,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<HStack>\n\t\t\t\t\t\t\t\t\t\t{ isBackToDashboardButton && (\n\t\t\t\t\t\t\t\t\t\t\t<SiteTitle />\n\t\t\t\t\t\t\t\t\t\t) }\n\n\t\t\t\t\t\t\t\t\t\t{ showEditButton && (\n\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__edit-button\"\n\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'Open the editor'\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\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t__unstableSetCanvasMode(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'edit'\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>\n\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'Edit' ) }\n\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</AnimatePresence>\n\n\t\t\t\t\t\t{ isMobileViewport && ! isMobileCanvasVisible && (\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\tsetIsMobileCanvasVisible( true )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tstyle={ { position: 'fixed', right: 0 } }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'View Editor' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t\t<AnimatePresence>\n\t\t\t\t\t\t{ isEditorPage && canvasMode === 'edit' && (\n\t\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\t\tas={ motion.div }\n\t\t\t\t\t\t\t\tinitial={ { y: -60 } }\n\t\t\t\t\t\t\t\tanimate={ { y: 0 } }\n\t\t\t\t\t\t\t\texit={ { y: -60 } }\n\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__editor-header\"\n\t\t\t\t\t\t\t\tariaLabel={ __( 'Editor top bar' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Header />\n\t\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</AnimatePresence>\n\t\t\t\t</div>\n\n\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t{ showSidebar && (\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tinitial={ {\n\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\texit={ {\n\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Sidebar />\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t) }\n\t\t\t\t</AnimatePresence>\n\n\t\t\t\t{ showCanvas && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"edit-site-layout__canvas-container\"\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\tpaddingTop: showFrame ? canvasPadding : 0,\n\t\t\t\t\t\t\tpaddingBottom: showFrame ? canvasPadding : 0,\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ canvasResizer }\n\t\t\t\t\t\t{ !! canvasSize.width && (\n\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\tinitial={ false }\n\t\t\t\t\t\t\t\tlayout=\"position\"\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__canvas\"\n\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t\t\t\t\tbottom: 0,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tinitial={ false }\n\t\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\t\twidth: showFrame\n\t\t\t\t\t\t\t\t\t\t\t? canvasSize.width - canvasPadding\n\t\t\t\t\t\t\t\t\t\t\t: fullSize.width,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\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<ErrorBoundary onError={ onError }>\n\t\t\t\t\t\t\t\t\t\t{ isEditorPage && <Editor /> }\n\t\t\t\t\t\t\t\t\t\t{ isListPage && <ListPage /> }\n\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/layout/index.js"],"names":["ANIMATION_DURATION","Layout","onError","params","isListPage","isEditorPage","canvasMode","previousShortcut","nextShortcut","select","getAllShortcutKeyCombinations","keyboardShortcutsStore","__unstableGetCanvasMode","editSiteStore","navigateRegionsProps","previous","next","disableMotion","isMobileViewport","isMobileCanvasVisible","setIsMobileCanvasVisible","canvasPadding","showSidebar","showCanvas","showFrame","isFullCanvas","canvasResizer","canvasSize","fullResizer","fullSize","ref","className","motion","div","y","type","duration","ease","opacity","paddingTop","paddingBottom","width","position","top","left","bottom"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n\t__unstableUseNavigateRegions as useNavigateRegions,\n} from '@wordpress/components';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tuseResizeObserver,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { useState, useEffect } from '@wordpress/element';\nimport { NavigableRegion } from '@wordpress/interface';\nimport { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';\n\n/**\n * Internal dependencies\n */\nimport Sidebar from '../sidebar';\nimport Editor from '../editor';\nimport ListPage from '../list';\nimport ErrorBoundary from '../error-boundary';\nimport { store as editSiteStore } from '../../store';\nimport { useLocation } from '../routes';\nimport getIsListPage from '../../utils/get-is-list-page';\nimport Header from '../header-edit-mode';\nimport useInitEditedEntityFromURL from '../sync-state-with-url/use-init-edited-entity-from-url';\nimport SiteHub from '../site-hub';\n\nconst ANIMATION_DURATION = 0.5;\n\nexport default function Layout( { onError } ) {\n\t// This ensures the edited entity id and type are initialized properly.\n\tuseInitEditedEntityFromURL();\n\n\tconst { params } = useLocation();\n\tconst isListPage = getIsListPage( params );\n\tconst isEditorPage = ! isListPage;\n\tconst { canvasMode, previousShortcut, nextShortcut } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getAllShortcutKeyCombinations } = select(\n\t\t\t\tkeyboardShortcutsStore\n\t\t\t);\n\t\t\tconst { __unstableGetCanvasMode } = select( editSiteStore );\n\t\t\treturn {\n\t\t\t\tcanvasMode: __unstableGetCanvasMode(),\n\t\t\t\tpreviousShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t\t'core/edit-site/previous-region'\n\t\t\t\t),\n\t\t\t\tnextShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t\t'core/edit-site/next-region'\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\tconst navigateRegionsProps = useNavigateRegions( {\n\t\tprevious: previousShortcut,\n\t\tnext: nextShortcut,\n\t} );\n\tconst disableMotion = useReducedMotion();\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst [ isMobileCanvasVisible, setIsMobileCanvasVisible ] =\n\t\tuseState( false );\n\tconst canvasPadding = isMobileViewport ? 0 : 24;\n\tconst showSidebar =\n\t\t( isMobileViewport && ! isMobileCanvasVisible ) ||\n\t\t( ! isMobileViewport && ( canvasMode === 'view' || ! isEditorPage ) );\n\tconst showCanvas =\n\t\t( isMobileViewport && isMobileCanvasVisible ) || ! isMobileViewport;\n\tconst showFrame =\n\t\t! isEditorPage || ( canvasMode === 'view' && ! isMobileViewport );\n\n\tconst isFullCanvas =\n\t\t( isEditorPage && canvasMode === 'edit' && ! isMobileViewport ) ||\n\t\tisMobileCanvasVisible;\n\t// Ideally this effect could be removed if we move the \"isMobileCanvasVisible\" into the store.\n\tconst [ canvasResizer, canvasSize ] = useResizeObserver();\n\tconst [ fullResizer, fullSize ] = useResizeObserver();\n\tuseEffect( () => {\n\t\tif ( canvasMode === 'view' && isMobileViewport ) {\n\t\t\tsetIsMobileCanvasVisible( false );\n\t\t}\n\n\t\tif ( canvasMode === 'edit' && isMobileViewport ) {\n\t\t\tsetIsMobileCanvasVisible( true );\n\t\t}\n\t}, [ canvasMode, isMobileViewport ] );\n\n\treturn (\n\t\t<>\n\t\t\t{ fullResizer }\n\t\t\t<div\n\t\t\t\t{ ...navigateRegionsProps }\n\t\t\t\tref={ navigateRegionsProps.ref }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\t'edit-site-layout',\n\t\t\t\t\tnavigateRegionsProps.className,\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-full-canvas': isFullCanvas,\n\t\t\t\t\t\t'is-edit-mode': canvasMode === 'edit',\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<SiteHub\n\t\t\t\t\tclassName=\"edit-site-layout__hub\"\n\t\t\t\t\tisMobileCanvasVisible={ isMobileCanvasVisible }\n\t\t\t\t\tsetIsMobileCanvasVisible={ setIsMobileCanvasVisible }\n\t\t\t\t/>\n\n\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t{ isEditorPage &&\n\t\t\t\t\t\t( canvasMode === 'edit' || isMobileCanvasVisible ) && (\n\t\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__header\"\n\t\t\t\t\t\t\t\tariaLabel={ __( 'Editor top bar' ) }\n\t\t\t\t\t\t\t\tas={ motion.div }\n\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\ty: 0,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tinitial={ {\n\t\t\t\t\t\t\t\t\ty: '-100%',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\texit={ {\n\t\t\t\t\t\t\t\t\ty: '-100%',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ canvasMode === 'edit' && <Header /> }\n\t\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t\t) }\n\t\t\t\t</AnimatePresence>\n\n\t\t\t\t<div className=\"edit-site-layout__content\">\n\t\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t\t{ showSidebar && (\n\t\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\t\tas={ motion.div }\n\t\t\t\t\t\t\t\tinitial={ {\n\t\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\texit={ {\n\t\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar\"\n\t\t\t\t\t\t\t\tariaLabel={ __( 'Navigation sidebar' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Sidebar />\n\t\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</AnimatePresence>\n\n\t\t\t\t\t{ showCanvas && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__canvas-container\"\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tpaddingTop: showFrame ? canvasPadding : 0,\n\t\t\t\t\t\t\t\tpaddingBottom: showFrame ? canvasPadding : 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ canvasResizer }\n\t\t\t\t\t\t\t{ !! canvasSize.width && (\n\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\tinitial={ false }\n\t\t\t\t\t\t\t\t\tlayout=\"position\"\n\t\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__canvas\"\n\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\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<motion.div\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t\t\t\t\t\tbottom: 0,\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tinitial={ false }\n\t\t\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\t\t\twidth: showFrame\n\t\t\t\t\t\t\t\t\t\t\t\t? canvasSize.width -\n\t\t\t\t\t\t\t\t\t\t\t\t  canvasPadding\n\t\t\t\t\t\t\t\t\t\t\t\t: fullSize.width,\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<ErrorBoundary onError={ onError }>\n\t\t\t\t\t\t\t\t\t\t\t{ isEditorPage && <Editor /> }\n\t\t\t\t\t\t\t\t\t\t\t{ isListPage && <ListPage /> }\n\t\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"]}

package/build/components/sidebar/index.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Sidebar = Sidebar;
+exports.default = void 0;
 
 var _element = require("@wordpress/element");
 
@@ -39,4 +39,8 @@ function Sidebar() {
     initialPath: "/"
   }, (0, _element.createElement)(SidebarScreens, null));
 }
+
+var _default = (0, _element.memo)(Sidebar);
+
+exports.default = _default;
 //# sourceMappingURL=index.js.map

package/build/components/sidebar/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar/index.js"],"names":["SidebarScreens","Sidebar"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAKA,SAASA,cAAT,GAA0B;AACzB;AAEA,SACC,qDACC,4BAAC,oCAAD,OADD,EAEC,4BAAC,yCAAD;AAAkC,IAAA,QAAQ,EAAC;AAA3C,IAFD,EAGC,4BAAC,yCAAD;AAAkC,IAAA,QAAQ,EAAC;AAA3C,IAHD,CADD;AAOA;;AAEM,SAASC,OAAT,GAAmB;AACzB,SACC,4BAAC,2CAAD;AACC,IAAA,SAAS,EAAC,4BADX;AAEC,IAAA,WAAW,EAAC;AAFb,KAIC,4BAAC,cAAD,OAJD,CADD;AAQA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalNavigatorProvider as NavigatorProvider } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport SidebarNavigationScreenMain from '../sidebar-navigation-screen-main';\nimport SidebarNavigationScreenTemplates from '../sidebar-navigation-screen-templates';\nimport useSyncSidebarPathWithURL from '../sync-state-with-url/use-sync-sidebar-path-with-url';\n\nfunction SidebarScreens() {\n\tuseSyncSidebarPathWithURL();\n\n\treturn (\n\t\t<>\n\t\t\t<SidebarNavigationScreenMain />\n\t\t\t<SidebarNavigationScreenTemplates postType=\"wp_template\" />\n\t\t\t<SidebarNavigationScreenTemplates postType=\"wp_template_part\" />\n\t\t</>\n\t);\n}\n\nexport function Sidebar() {\n\treturn (\n\t\t<NavigatorProvider\n\t\t\tclassName=\"edit-site-sidebar__content\"\n\t\t\tinitialPath=\"/\"\n\t\t>\n\t\t\t<SidebarScreens />\n\t\t</NavigatorProvider>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar/index.js"],"names":["SidebarScreens","Sidebar"],"mappings":";;;;;;;;;AAGA;;AACA;;AAKA;;AACA;;AACA;;AAXA;AACA;AACA;;AAIA;AACA;AACA;AAKA,SAASA,cAAT,GAA0B;AACzB;AAEA,SACC,qDACC,4BAAC,oCAAD,OADD,EAEC,4BAAC,yCAAD;AAAkC,IAAA,QAAQ,EAAC;AAA3C,IAFD,EAGC,4BAAC,yCAAD;AAAkC,IAAA,QAAQ,EAAC;AAA3C,IAHD,CADD;AAOA;;AAED,SAASC,OAAT,GAAmB;AAClB,SACC,4BAAC,2CAAD;AACC,IAAA,SAAS,EAAC,4BADX;AAEC,IAAA,WAAW,EAAC;AAFb,KAIC,4BAAC,cAAD,OAJD,CADD;AAQA;;eAEc,mBAAMA,OAAN,C","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { memo } from '@wordpress/element';\nimport { __experimentalNavigatorProvider as NavigatorProvider } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport SidebarNavigationScreenMain from '../sidebar-navigation-screen-main';\nimport SidebarNavigationScreenTemplates from '../sidebar-navigation-screen-templates';\nimport useSyncSidebarPathWithURL from '../sync-state-with-url/use-sync-sidebar-path-with-url';\n\nfunction SidebarScreens() {\n\tuseSyncSidebarPathWithURL();\n\n\treturn (\n\t\t<>\n\t\t\t<SidebarNavigationScreenMain />\n\t\t\t<SidebarNavigationScreenTemplates postType=\"wp_template\" />\n\t\t\t<SidebarNavigationScreenTemplates postType=\"wp_template_part\" />\n\t\t</>\n\t);\n}\n\nfunction Sidebar() {\n\treturn (\n\t\t<NavigatorProvider\n\t\t\tclassName=\"edit-site-sidebar__content\"\n\t\t\tinitialPath=\"/\"\n\t\t>\n\t\t\t<SidebarScreens />\n\t\t</NavigatorProvider>\n\t);\n}\n\nexport default memo( Sidebar );\n"]}

package/build/components/sidebar-edit-mode/index.js

@@ -53,6 +53,8 @@ const SidebarInspectorFill = InspectorFill;
 exports.SidebarInspectorFill = SidebarInspectorFill;
 
 function SidebarComplementaryAreaFills() {
+  var _window;
+
   const {
     sidebar,
     isEditorSidebarOpened,
@@ -94,7 +96,7 @@ function SidebarComplementaryAreaFills() {
 
   let MaybeNavigationMenuSidebar = _element.Fragment;
 
-  if (process.env.IS_GUTENBERG_PLUGIN) {
+  if (((_window = window) === null || _window === void 0 ? void 0 : _window.__experimentalEnableOffCanvasNavigationEditor) === true) {
     MaybeNavigationMenuSidebar = _navigationMenuSidebar.default;
   }
 

package/build/components/sidebar-edit-mode/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/index.js"],"names":["Slot","InspectorSlot","Fill","InspectorFill","SidebarInspectorFill","SidebarComplementaryAreaFills","sidebar","isEditorSidebarOpened","hasBlockSelection","supportsGlobalStyles","select","_sidebar","interfaceStore","getActiveComplementaryArea","STORE_NAME","_isEditorSidebarOpened","SIDEBAR_BLOCK","SIDEBAR_TEMPLATE","includes","settings","editSiteStore","getSettings","blockEditorStore","getBlockSelectionStart","supportsTemplatePartsMode","enableComplementaryArea","sidebarName","MaybeNavigationMenuSidebar","Fragment","process","env","IS_GUTENBERG_PLUGIN","NavigationMenuSidebar","drawerLeft","drawerRight"],"mappings":";;;;;;;;;;AAMA;;AAHA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AArBA;AACA;AACA;;AASA;AACA;AACA;AAUA,MAAM;AAAEA,EAAAA,IAAI,EAAEC,aAAR;AAAuBC,EAAAA,IAAI,EAAEC;AAA7B,IAA+C,gCACpD,0BADoD,CAArD;AAGO,MAAMC,oBAAoB,GAAGD,aAA7B;;;AAEA,SAASE,6BAAT,GAAyC;AAC/C,QAAM;AACLC,IAAAA,OADK;AAELC,IAAAA,qBAFK;AAGLC,IAAAA,iBAHK;AAILC,IAAAA;AAJK,MAKF,qBAAaC,MAAF,IAAc;AAC5B,UAAMC,QAAQ,GACbD,MAAM,CAAEE,gBAAF,CAAN,CAAyBC,0BAAzB,CAAqDC,qBAArD,CADD;;AAEA,UAAMC,sBAAsB,GAAG,CAC9BC,yBAD8B,EAE9BC,4BAF8B,EAG7BC,QAH6B,CAGnBP,QAHmB,CAA/B;;AAIA,UAAMQ,QAAQ,GAAGT,MAAM,CAAEU,YAAF,CAAN,CAAwBC,WAAxB,EAAjB;AACA,WAAO;AACNf,MAAAA,OAAO,EAAEK,QADH;AAENJ,MAAAA,qBAAqB,EAAEQ,sBAFjB;AAGNP,MAAAA,iBAAiB,EAChB,CAAC,CAAEE,MAAM,CAAEY,kBAAF,CAAN,CAA2BC,sBAA3B,EAJE;AAKNd,MAAAA,oBAAoB,EAAE,EAAEU,QAAF,aAAEA,QAAF,eAAEA,QAAQ,CAAEK,yBAAZ;AALhB,KAAP;AAOA,GAfG,EAeD,EAfC,CALJ;AAqBA,QAAM;AAAEC,IAAAA;AAAF,MAA8B,uBAAab,gBAAb,CAApC;AAEA,0BAAW,MAAM;AAChB,QAAK,CAAEL,qBAAP,EAA+B;;AAC/B,QAAKC,iBAAL,EAAyB;AACxBiB,MAAAA,uBAAuB,CAAEX,qBAAF,EAAcE,yBAAd,CAAvB;AACA,KAFD,MAEO;AACNS,MAAAA,uBAAuB,CAAEX,qBAAF,EAAcG,4BAAd,CAAvB;AACA;AACD,GAPD,EAOG,CAAET,iBAAF,EAAqBD,qBAArB,CAPH;AASA,MAAImB,WAAW,GAAGpB,OAAlB;;AACA,MAAK,CAAEC,qBAAP,EAA+B;AAC9BmB,IAAAA,WAAW,GAAGlB,iBAAiB,GAAGQ,yBAAH,GAAmBC,4BAAlD;AACA,GApC8C,CAsC/C;AACA;AACA;;;AACA,MAAIU,0BAA0B,GAAGC,iBAAjC;;AAEA,MAAKC,OAAO,CAACC,GAAR,CAAYC,mBAAjB,EAAuC;AACtCJ,IAAAA,0BAA0B,GAAGK,8BAA7B;AACA;;AAED,SACC,qDACC,4BAAC,uBAAD;AACC,IAAA,UAAU,EAAGN,WADd;AAEC,IAAA,KAAK,EAAG,cAAI,UAAJ,CAFT;AAGC,IAAA,IAAI,EAAG,qBAAUO,iBAAV,GAAuBC,kBAH/B;AAIC,IAAA,UAAU,EAAG,cAAI,wBAAJ,CAJd;AAKC,IAAA,MAAM,EAAG,4BAAC,uBAAD;AAAgB,MAAA,WAAW,EAAGR;AAA9B,MALV;AAMC,IAAA,eAAe,EAAC;AANjB,KAQGA,WAAW,KAAKT,4BAAhB,IACD,4BAAC,qBAAD,QACC,4BAAC,qBAAD,OADD,CATF,EAaGS,WAAW,KAAKV,yBAAhB,IACD,4BAAC,aAAD;AAAe,IAAA,gBAAgB;AAA/B,IAdF,CADD,EAkBGP,oBAAoB,IAAI,4BAAC,4BAAD,OAlB3B,EAmBC,4BAAC,0BAAD,OAnBD,CADD;AAuBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createSlotFill, PanelBody } from '@wordpress/components';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { drawerLeft, drawerRight } from '@wordpress/icons';\nimport { useEffect, Fragment } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { store as interfaceStore } from '@wordpress/interface';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport DefaultSidebar from './default-sidebar';\nimport GlobalStylesSidebar from './global-styles-sidebar';\nimport NavigationMenuSidebar from './navigation-menu-sidebar';\nimport { STORE_NAME } from '../../store/constants';\nimport SettingsHeader from './settings-header';\nimport TemplateCard from './template-card';\nimport { SIDEBAR_BLOCK, SIDEBAR_TEMPLATE } from './constants';\nimport { store as editSiteStore } from '../../store';\n\nconst { Slot: InspectorSlot, Fill: InspectorFill } = createSlotFill(\n\t'EditSiteSidebarInspector'\n);\nexport const SidebarInspectorFill = InspectorFill;\n\nexport function SidebarComplementaryAreaFills() {\n\tconst {\n\t\tsidebar,\n\t\tisEditorSidebarOpened,\n\t\thasBlockSelection,\n\t\tsupportsGlobalStyles,\n\t} = useSelect( ( select ) => {\n\t\tconst _sidebar =\n\t\t\tselect( interfaceStore ).getActiveComplementaryArea( STORE_NAME );\n\t\tconst _isEditorSidebarOpened = [\n\t\t\tSIDEBAR_BLOCK,\n\t\t\tSIDEBAR_TEMPLATE,\n\t\t].includes( _sidebar );\n\t\tconst settings = select( editSiteStore ).getSettings();\n\t\treturn {\n\t\t\tsidebar: _sidebar,\n\t\t\tisEditorSidebarOpened: _isEditorSidebarOpened,\n\t\t\thasBlockSelection:\n\t\t\t\t!! select( blockEditorStore ).getBlockSelectionStart(),\n\t\t\tsupportsGlobalStyles: ! settings?.supportsTemplatePartsMode,\n\t\t};\n\t}, [] );\n\tconst { enableComplementaryArea } = useDispatch( interfaceStore );\n\n\tuseEffect( () => {\n\t\tif ( ! isEditorSidebarOpened ) return;\n\t\tif ( hasBlockSelection ) {\n\t\t\tenableComplementaryArea( STORE_NAME, SIDEBAR_BLOCK );\n\t\t} else {\n\t\t\tenableComplementaryArea( STORE_NAME, SIDEBAR_TEMPLATE );\n\t\t}\n\t}, [ hasBlockSelection, isEditorSidebarOpened ] );\n\n\tlet sidebarName = sidebar;\n\tif ( ! isEditorSidebarOpened ) {\n\t\tsidebarName = hasBlockSelection ? SIDEBAR_BLOCK : SIDEBAR_TEMPLATE;\n\t}\n\n\t// Conditionally include NavMenu sidebar in Plugin only.\n\t// Optimise for dead code elimination.\n\t// See https://github.com/WordPress/gutenberg/blob/trunk/docs/how-to-guides/feature-flags.md#dead-code-elimination.\n\tlet MaybeNavigationMenuSidebar = Fragment;\n\n\tif ( process.env.IS_GUTENBERG_PLUGIN ) {\n\t\tMaybeNavigationMenuSidebar = NavigationMenuSidebar;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<DefaultSidebar\n\t\t\t\tidentifier={ sidebarName }\n\t\t\t\ttitle={ __( 'Settings' ) }\n\t\t\t\ticon={ isRTL() ? drawerLeft : drawerRight }\n\t\t\t\tcloseLabel={ __( 'Close settings sidebar' ) }\n\t\t\t\theader={ <SettingsHeader sidebarName={ sidebarName } /> }\n\t\t\t\theaderClassName=\"edit-site-sidebar-edit-mode__panel-tabs\"\n\t\t\t>\n\t\t\t\t{ sidebarName === SIDEBAR_TEMPLATE && (\n\t\t\t\t\t<PanelBody>\n\t\t\t\t\t\t<TemplateCard />\n\t\t\t\t\t</PanelBody>\n\t\t\t\t) }\n\t\t\t\t{ sidebarName === SIDEBAR_BLOCK && (\n\t\t\t\t\t<InspectorSlot bubblesVirtually />\n\t\t\t\t) }\n\t\t\t</DefaultSidebar>\n\t\t\t{ supportsGlobalStyles && <GlobalStylesSidebar /> }\n\t\t\t<MaybeNavigationMenuSidebar />\n\t\t</>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/index.js"],"names":["Slot","InspectorSlot","Fill","InspectorFill","SidebarInspectorFill","SidebarComplementaryAreaFills","sidebar","isEditorSidebarOpened","hasBlockSelection","supportsGlobalStyles","select","_sidebar","interfaceStore","getActiveComplementaryArea","STORE_NAME","_isEditorSidebarOpened","SIDEBAR_BLOCK","SIDEBAR_TEMPLATE","includes","settings","editSiteStore","getSettings","blockEditorStore","getBlockSelectionStart","supportsTemplatePartsMode","enableComplementaryArea","sidebarName","MaybeNavigationMenuSidebar","Fragment","window","__experimentalEnableOffCanvasNavigationEditor","NavigationMenuSidebar","drawerLeft","drawerRight"],"mappings":";;;;;;;;;;AAMA;;AAHA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AArBA;AACA;AACA;;AASA;AACA;AACA;AAUA,MAAM;AAAEA,EAAAA,IAAI,EAAEC,aAAR;AAAuBC,EAAAA,IAAI,EAAEC;AAA7B,IAA+C,gCACpD,0BADoD,CAArD;AAGO,MAAMC,oBAAoB,GAAGD,aAA7B;;;AAEA,SAASE,6BAAT,GAAyC;AAAA;;AAC/C,QAAM;AACLC,IAAAA,OADK;AAELC,IAAAA,qBAFK;AAGLC,IAAAA,iBAHK;AAILC,IAAAA;AAJK,MAKF,qBAAaC,MAAF,IAAc;AAC5B,UAAMC,QAAQ,GACbD,MAAM,CAAEE,gBAAF,CAAN,CAAyBC,0BAAzB,CAAqDC,qBAArD,CADD;;AAEA,UAAMC,sBAAsB,GAAG,CAC9BC,yBAD8B,EAE9BC,4BAF8B,EAG7BC,QAH6B,CAGnBP,QAHmB,CAA/B;;AAIA,UAAMQ,QAAQ,GAAGT,MAAM,CAAEU,YAAF,CAAN,CAAwBC,WAAxB,EAAjB;AACA,WAAO;AACNf,MAAAA,OAAO,EAAEK,QADH;AAENJ,MAAAA,qBAAqB,EAAEQ,sBAFjB;AAGNP,MAAAA,iBAAiB,EAChB,CAAC,CAAEE,MAAM,CAAEY,kBAAF,CAAN,CAA2BC,sBAA3B,EAJE;AAKNd,MAAAA,oBAAoB,EAAE,EAAEU,QAAF,aAAEA,QAAF,eAAEA,QAAQ,CAAEK,yBAAZ;AALhB,KAAP;AAOA,GAfG,EAeD,EAfC,CALJ;AAqBA,QAAM;AAAEC,IAAAA;AAAF,MAA8B,uBAAab,gBAAb,CAApC;AAEA,0BAAW,MAAM;AAChB,QAAK,CAAEL,qBAAP,EAA+B;;AAC/B,QAAKC,iBAAL,EAAyB;AACxBiB,MAAAA,uBAAuB,CAAEX,qBAAF,EAAcE,yBAAd,CAAvB;AACA,KAFD,MAEO;AACNS,MAAAA,uBAAuB,CAAEX,qBAAF,EAAcG,4BAAd,CAAvB;AACA;AACD,GAPD,EAOG,CAAET,iBAAF,EAAqBD,qBAArB,CAPH;AASA,MAAImB,WAAW,GAAGpB,OAAlB;;AACA,MAAK,CAAEC,qBAAP,EAA+B;AAC9BmB,IAAAA,WAAW,GAAGlB,iBAAiB,GAAGQ,yBAAH,GAAmBC,4BAAlD;AACA,GApC8C,CAsC/C;AACA;AACA;;;AACA,MAAIU,0BAA0B,GAAGC,iBAAjC;;AAEA,MAAK,YAAAC,MAAM,UAAN,0CAAQC,6CAAR,MAA0D,IAA/D,EAAsE;AACrEH,IAAAA,0BAA0B,GAAGI,8BAA7B;AACA;;AAED,SACC,qDACC,4BAAC,uBAAD;AACC,IAAA,UAAU,EAAGL,WADd;AAEC,IAAA,KAAK,EAAG,cAAI,UAAJ,CAFT;AAGC,IAAA,IAAI,EAAG,qBAAUM,iBAAV,GAAuBC,kBAH/B;AAIC,IAAA,UAAU,EAAG,cAAI,wBAAJ,CAJd;AAKC,IAAA,MAAM,EAAG,4BAAC,uBAAD;AAAgB,MAAA,WAAW,EAAGP;AAA9B,MALV;AAMC,IAAA,eAAe,EAAC;AANjB,KAQGA,WAAW,KAAKT,4BAAhB,IACD,4BAAC,qBAAD,QACC,4BAAC,qBAAD,OADD,CATF,EAaGS,WAAW,KAAKV,yBAAhB,IACD,4BAAC,aAAD;AAAe,IAAA,gBAAgB;AAA/B,IAdF,CADD,EAkBGP,oBAAoB,IAAI,4BAAC,4BAAD,OAlB3B,EAmBC,4BAAC,0BAAD,OAnBD,CADD;AAuBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createSlotFill, PanelBody } from '@wordpress/components';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { drawerLeft, drawerRight } from '@wordpress/icons';\nimport { useEffect, Fragment } from '@wordpress/element';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { store as interfaceStore } from '@wordpress/interface';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\n\n/**\n * Internal dependencies\n */\nimport DefaultSidebar from './default-sidebar';\nimport GlobalStylesSidebar from './global-styles-sidebar';\nimport NavigationMenuSidebar from './navigation-menu-sidebar';\nimport { STORE_NAME } from '../../store/constants';\nimport SettingsHeader from './settings-header';\nimport TemplateCard from './template-card';\nimport { SIDEBAR_BLOCK, SIDEBAR_TEMPLATE } from './constants';\nimport { store as editSiteStore } from '../../store';\n\nconst { Slot: InspectorSlot, Fill: InspectorFill } = createSlotFill(\n\t'EditSiteSidebarInspector'\n);\nexport const SidebarInspectorFill = InspectorFill;\n\nexport function SidebarComplementaryAreaFills() {\n\tconst {\n\t\tsidebar,\n\t\tisEditorSidebarOpened,\n\t\thasBlockSelection,\n\t\tsupportsGlobalStyles,\n\t} = useSelect( ( select ) => {\n\t\tconst _sidebar =\n\t\t\tselect( interfaceStore ).getActiveComplementaryArea( STORE_NAME );\n\t\tconst _isEditorSidebarOpened = [\n\t\t\tSIDEBAR_BLOCK,\n\t\t\tSIDEBAR_TEMPLATE,\n\t\t].includes( _sidebar );\n\t\tconst settings = select( editSiteStore ).getSettings();\n\t\treturn {\n\t\t\tsidebar: _sidebar,\n\t\t\tisEditorSidebarOpened: _isEditorSidebarOpened,\n\t\t\thasBlockSelection:\n\t\t\t\t!! select( blockEditorStore ).getBlockSelectionStart(),\n\t\t\tsupportsGlobalStyles: ! settings?.supportsTemplatePartsMode,\n\t\t};\n\t}, [] );\n\tconst { enableComplementaryArea } = useDispatch( interfaceStore );\n\n\tuseEffect( () => {\n\t\tif ( ! isEditorSidebarOpened ) return;\n\t\tif ( hasBlockSelection ) {\n\t\t\tenableComplementaryArea( STORE_NAME, SIDEBAR_BLOCK );\n\t\t} else {\n\t\t\tenableComplementaryArea( STORE_NAME, SIDEBAR_TEMPLATE );\n\t\t}\n\t}, [ hasBlockSelection, isEditorSidebarOpened ] );\n\n\tlet sidebarName = sidebar;\n\tif ( ! isEditorSidebarOpened ) {\n\t\tsidebarName = hasBlockSelection ? SIDEBAR_BLOCK : SIDEBAR_TEMPLATE;\n\t}\n\n\t// Conditionally include NavMenu sidebar in Plugin only.\n\t// Optimise for dead code elimination.\n\t// See https://github.com/WordPress/gutenberg/blob/trunk/docs/how-to-guides/feature-flags.md#dead-code-elimination.\n\tlet MaybeNavigationMenuSidebar = Fragment;\n\n\tif ( window?.__experimentalEnableOffCanvasNavigationEditor === true ) {\n\t\tMaybeNavigationMenuSidebar = NavigationMenuSidebar;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<DefaultSidebar\n\t\t\t\tidentifier={ sidebarName }\n\t\t\t\ttitle={ __( 'Settings' ) }\n\t\t\t\ticon={ isRTL() ? drawerLeft : drawerRight }\n\t\t\t\tcloseLabel={ __( 'Close settings sidebar' ) }\n\t\t\t\theader={ <SettingsHeader sidebarName={ sidebarName } /> }\n\t\t\t\theaderClassName=\"edit-site-sidebar-edit-mode__panel-tabs\"\n\t\t\t>\n\t\t\t\t{ sidebarName === SIDEBAR_TEMPLATE && (\n\t\t\t\t\t<PanelBody>\n\t\t\t\t\t\t<TemplateCard />\n\t\t\t\t\t</PanelBody>\n\t\t\t\t) }\n\t\t\t\t{ sidebarName === SIDEBAR_BLOCK && (\n\t\t\t\t\t<InspectorSlot bubblesVirtually />\n\t\t\t\t) }\n\t\t\t</DefaultSidebar>\n\t\t\t{ supportsGlobalStyles && <GlobalStylesSidebar /> }\n\t\t\t<MaybeNavigationMenuSidebar />\n\t\t</>\n\t);\n}\n"]}

package/build/components/sidebar-edit-mode/navigation-menu-sidebar/navigation-menu.js

@@ -22,6 +22,8 @@ const ALLOWED_BLOCKS = {
 };
 
 function NavigationMenu(_ref) {
+  var _window;
+
   let {
     innerBlocks,
     id
@@ -43,6 +45,14 @@ function NavigationMenu(_ref) {
       }
     });
   }, [updateBlockListSettings, innerBlocks]);
+
+  if ((_window = window) !== null && _window !== void 0 && _window.__experimentalEnableOffCanvasNavigationEditor) {
+    return (0, _element.createElement)(_blockEditor.__experimentalOffCanvasEditor, {
+      blocks: innerBlocks,
+      selectBlockInCanvas: false
+    });
+  }
+
   return (0, _element.createElement)(_blockEditor.__experimentalListView, {
     id: id
   });