@wordpress/edit-site 5.8.0 → 5.10.0

package/build/components/routes/use-title.js

@@ -17,7 +17,9 @@ var _a11y = require("@wordpress/a11y");
 
 var _htmlEntities = require("@wordpress/html-entities");
 
-var _index = require("./index");
+var _router = require("@wordpress/router");
+
+var _privateApis = require("../../private-apis");
 
 /**
  * WordPress dependencies
@@ -26,8 +28,12 @@ var _index = require("./index");
 /**
  * Internal dependencies
  */
+const {
+  useLocation
+} = (0, _privateApis.unlock)(_router.privateApis);
+
 function useTitle(title) {
-  const location = (0, _index.useLocation)();
+  const location = useLocation();
   const siteTitle = (0, _data.useSelect)(select => {
     var _select$getEntityReco;
 

package/build/components/routes/use-title.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/routes/use-title.js"],"names":["useTitle","title","location","siteTitle","select","coreStore","getEntityRecord","isInitialLocationRef","current","formattedTitle","document"],"mappings":";;;;;;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AAbA;AACA;AACA;;AAQA;AACA;AACA;AAGe,SAASA,QAAT,CAAmBC,KAAnB,EAA2B;AACzC,QAAMC,QAAQ,GAAG,yBAAjB;AACA,QAAMC,SAAS,GAAG,qBACfC,MAAF;AAAA;;AAAA,oCACCA,MAAM,CAAEC,eAAF,CAAN,CAAoBC,eAApB,CAAqC,MAArC,EAA6C,MAA7C,CADD,0DACC,sBAAuDL,KADxD;AAAA,GADiB,EAGjB,EAHiB,CAAlB;AAKA,QAAMM,oBAAoB,GAAG,qBAAQ,IAAR,CAA7B;AAEA,0BAAW,MAAM;AAChBA,IAAAA,oBAAoB,CAACC,OAArB,GAA+B,KAA/B;AACA,GAFD,EAEG,CAAEN,QAAF,CAFH;AAIA,0BAAW,MAAM;AAChB;AACA,QAAKK,oBAAoB,CAACC,OAA1B,EAAoC;AACnC;AACA;;AAED,QAAKP,KAAK,IAAIE,SAAd,EAA0B;AACzB;AACA,YAAMM,cAAc,GAAG;AACtB;AACA,oBAAI,yBAAJ,CAFsB,EAGtB,kCAAgBR,KAAhB,CAHsB,EAItB,kCAAgBE,SAAhB,CAJsB,CAAvB;AAOAO,MAAAA,QAAQ,CAACT,KAAT,GAAiBQ,cAAjB,CATyB,CAWzB;;AACA,uBACC;AACC;AACA,oBAAI,oBAAJ,CAFD,EAGCC,QAAQ,CAACT,KAHV,CADD,EAMC,WAND;AAQA;AACD,GA3BD,EA2BG,CAAEA,KAAF,EAASE,SAAT,EAAoBD,QAApB,CA3BH;AA4BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useRef } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { speak } from '@wordpress/a11y';\nimport { decodeEntities } from '@wordpress/html-entities';\n\n/**\n * Internal dependencies\n */\nimport { useLocation } from './index';\n\nexport default function useTitle( title ) {\n\tconst location = useLocation();\n\tconst siteTitle = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).getEntityRecord( 'root', 'site' )?.title,\n\t\t[]\n\t);\n\tconst isInitialLocationRef = useRef( true );\n\n\tuseEffect( () => {\n\t\tisInitialLocationRef.current = false;\n\t}, [ location ] );\n\n\tuseEffect( () => {\n\t\t// Don't update or announce the title for initial page load.\n\t\tif ( isInitialLocationRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( title && siteTitle ) {\n\t\t\t// @see https://github.com/WordPress/wordpress-develop/blob/94849898192d271d533e09756007e176feb80697/src/wp-admin/admin-header.php#L67-L68\n\t\t\tconst formattedTitle = sprintf(\n\t\t\t\t/* translators: Admin screen title. 1: Admin screen name, 2: Network or site name. */\n\t\t\t\t__( '%1$s ‹ %2$s — WordPress' ),\n\t\t\t\tdecodeEntities( title ),\n\t\t\t\tdecodeEntities( siteTitle )\n\t\t\t);\n\n\t\t\tdocument.title = formattedTitle;\n\n\t\t\t// Announce title on route change for screen readers.\n\t\t\tspeak(\n\t\t\t\tsprintf(\n\t\t\t\t\t/* translators: The page title that is currently displaying. */\n\t\t\t\t\t__( 'Now displaying: %s' ),\n\t\t\t\t\tdocument.title\n\t\t\t\t),\n\t\t\t\t'assertive'\n\t\t\t);\n\t\t}\n\t}, [ title, siteTitle, location ] );\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/routes/use-title.js"],"names":["useLocation","routerPrivateApis","useTitle","title","location","siteTitle","select","coreStore","getEntityRecord","isInitialLocationRef","current","formattedTitle","document"],"mappings":";;;;;;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AAdA;AACA;AACA;;AASA;AACA;AACA;AAGA,MAAM;AAAEA,EAAAA;AAAF,IAAkB,yBAAQC,mBAAR,CAAxB;;AAEe,SAASC,QAAT,CAAmBC,KAAnB,EAA2B;AACzC,QAAMC,QAAQ,GAAGJ,WAAW,EAA5B;AACA,QAAMK,SAAS,GAAG,qBACfC,MAAF;AAAA;;AAAA,oCACCA,MAAM,CAAEC,eAAF,CAAN,CAAoBC,eAApB,CAAqC,MAArC,EAA6C,MAA7C,CADD,0DACC,sBAAuDL,KADxD;AAAA,GADiB,EAGjB,EAHiB,CAAlB;AAKA,QAAMM,oBAAoB,GAAG,qBAAQ,IAAR,CAA7B;AAEA,0BAAW,MAAM;AAChBA,IAAAA,oBAAoB,CAACC,OAArB,GAA+B,KAA/B;AACA,GAFD,EAEG,CAAEN,QAAF,CAFH;AAIA,0BAAW,MAAM;AAChB;AACA,QAAKK,oBAAoB,CAACC,OAA1B,EAAoC;AACnC;AACA;;AAED,QAAKP,KAAK,IAAIE,SAAd,EAA0B;AACzB;AACA,YAAMM,cAAc,GAAG;AACtB;AACA,oBAAI,yBAAJ,CAFsB,EAGtB,kCAAgBR,KAAhB,CAHsB,EAItB,kCAAgBE,SAAhB,CAJsB,CAAvB;AAOAO,MAAAA,QAAQ,CAACT,KAAT,GAAiBQ,cAAjB,CATyB,CAWzB;;AACA,uBACC;AACC;AACA,oBAAI,oBAAJ,CAFD,EAGCC,QAAQ,CAACT,KAHV,CADD,EAMC,WAND;AAQA;AACD,GA3BD,EA2BG,CAAEA,KAAF,EAASE,SAAT,EAAoBD,QAApB,CA3BH;AA4BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useRef } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { speak } from '@wordpress/a11y';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../private-apis';\n\nconst { useLocation } = unlock( routerPrivateApis );\n\nexport default function useTitle( title ) {\n\tconst location = useLocation();\n\tconst siteTitle = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).getEntityRecord( 'root', 'site' )?.title,\n\t\t[]\n\t);\n\tconst isInitialLocationRef = useRef( true );\n\n\tuseEffect( () => {\n\t\tisInitialLocationRef.current = false;\n\t}, [ location ] );\n\n\tuseEffect( () => {\n\t\t// Don't update or announce the title for initial page load.\n\t\tif ( isInitialLocationRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( title && siteTitle ) {\n\t\t\t// @see https://github.com/WordPress/wordpress-develop/blob/94849898192d271d533e09756007e176feb80697/src/wp-admin/admin-header.php#L67-L68\n\t\t\tconst formattedTitle = sprintf(\n\t\t\t\t/* translators: Admin screen title. 1: Admin screen name, 2: Network or site name. */\n\t\t\t\t__( '%1$s ‹ %2$s — WordPress' ),\n\t\t\t\tdecodeEntities( title ),\n\t\t\t\tdecodeEntities( siteTitle )\n\t\t\t);\n\n\t\t\tdocument.title = formattedTitle;\n\n\t\t\t// Announce title on route change for screen readers.\n\t\t\tspeak(\n\t\t\t\tsprintf(\n\t\t\t\t\t/* translators: The page title that is currently displaying. */\n\t\t\t\t\t__( 'Now displaying: %s' ),\n\t\t\t\t\tdocument.title\n\t\t\t\t),\n\t\t\t\t'assertive'\n\t\t\t);\n\t\t}\n\t}, [ title, siteTitle, location ] );\n}\n"]}

package/build/components/save-button/index.js

@@ -19,6 +19,8 @@ var _keycodes = require("@wordpress/keycodes");
 
 var _store = require("../../store");
 
+var _isPreviewingTheme = require("../../utils/is-previewing-theme");
+
 /**
  * WordPress dependencies
  */
@@ -26,7 +28,13 @@ var _store = require("../../store");
 /**
  * Internal dependencies
  */
-function SaveButton() {
+function SaveButton(_ref) {
+  let {
+    className = 'edit-site-save-button__button',
+    variant = 'primary',
+    showTooltip = true,
+    icon
+  } = _ref;
   const {
     isDirty,
     isSaving,
@@ -51,11 +59,27 @@ function SaveButton() {
   const {
     setIsSaveViewOpened
   } = (0, _data.useDispatch)(_store.store);
-  const disabled = !isDirty || isSaving;
-  const label = (0, _i18n.__)('Save');
+  const activateSaveEnabled = (0, _isPreviewingTheme.isPreviewingTheme)() || isDirty;
+  const disabled = isSaving || !activateSaveEnabled;
+
+  const getLabel = () => {
+    if (disabled) {
+      return (0, _i18n.__)('Saved');
+    }
+
+    if ((0, _isPreviewingTheme.isPreviewingTheme)() && isDirty) {
+      return (0, _i18n.__)('Activate & Save');
+    } else if ((0, _isPreviewingTheme.isPreviewingTheme)()) {
+      return (0, _i18n.__)('Activate');
+    }
+
+    return (0, _i18n.__)('Save');
+  };
+
+  const label = getLabel();
   return (0, _element.createElement)(_components.Button, {
-    variant: "primary",
-    className: "edit-site-save-button__button",
+    variant: variant,
+    className: className,
     "aria-disabled": disabled,
     "aria-expanded": isSaveViewOpen,
     isBusy: isSaving,
@@ -74,7 +98,8 @@ function SaveButton() {
      & the tooltip is always rendered even when there's no keyboard shortcut.
      */
     ,
-    showTooltip: true
+    showTooltip: showTooltip,
+    icon: icon
   }, label);
 }
 //# sourceMappingURL=index.js.map

package/build/components/save-button/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/save-button/index.js"],"names":["SaveButton","isDirty","isSaving","isSaveViewOpen","select","__experimentalGetDirtyEntityRecords","isSavingEntityRecord","coreStore","dirtyEntityRecords","isSaveViewOpened","editSiteStore","length","some","record","kind","name","key","setIsSaveViewOpened","disabled","label","undefined","displayShortcut","primary"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AAZA;AACA;AACA;;AAOA;AACA;AACA;AAGe,SAASA,UAAT,GAAsB;AACpC,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA,QAAX;AAAqBC,IAAAA;AAArB,MAAwC,qBAAaC,MAAF,IAAc;AACtE,UAAM;AAAEC,MAAAA,mCAAF;AAAuCC,MAAAA;AAAvC,QACLF,MAAM,CAAEG,eAAF,CADP;;AAEA,UAAMC,kBAAkB,GAAGH,mCAAmC,EAA9D;;AACA,UAAM;AAAEI,MAAAA;AAAF,QAAuBL,MAAM,CAAEM,YAAF,CAAnC;AACA,WAAO;AACNT,MAAAA,OAAO,EAAEO,kBAAkB,CAACG,MAAnB,GAA4B,CAD/B;AAENT,MAAAA,QAAQ,EAAEM,kBAAkB,CAACI,IAAnB,CAA2BC,MAAF,IAClCP,oBAAoB,CAAEO,MAAM,CAACC,IAAT,EAAeD,MAAM,CAACE,IAAtB,EAA4BF,MAAM,CAACG,GAAnC,CADX,CAFJ;AAKNb,MAAAA,cAAc,EAAEM,gBAAgB;AAL1B,KAAP;AAOA,GAZ6C,EAY3C,EAZ2C,CAA9C;AAaA,QAAM;AAAEQ,IAAAA;AAAF,MAA0B,uBAAaP,YAAb,CAAhC;AAEA,QAAMQ,QAAQ,GAAG,CAAEjB,OAAF,IAAaC,QAA9B;AAEA,QAAMiB,KAAK,GAAG,cAAI,MAAJ,CAAd;AAEA,SACC,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAC,SADT;AAEC,IAAA,SAAS,EAAC,+BAFX;AAGC,qBAAgBD,QAHjB;AAIC,qBAAgBf,cAJjB;AAKC,IAAA,MAAM,EAAGD,QALV;AAMC,IAAA,OAAO,EAAGgB,QAAQ,GAAGE,SAAH,GAAe,MAAMH,mBAAmB,CAAE,IAAF,CAN3D;AAOC,IAAA,KAAK,EAAGE;AACR;AACH;AACA;AACA;AAXE;AAYC,IAAA,QAAQ,EAAGD,QAAQ,GAAGE,SAAH,GAAeC,0BAAgBC,OAAhB,CAAyB,GAAzB;AAClC;AACH;AACA;AACA;AACA;AACA;AAlBE;AAmBC,IAAA,WAAW;AAnBZ,KAqBGH,KArBH,CADD;AAyBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { Button } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { displayShortcut } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\n\nexport default function SaveButton() {\n\tconst { isDirty, isSaving, isSaveViewOpen } = useSelect( ( select ) => {\n\t\tconst { __experimentalGetDirtyEntityRecords, isSavingEntityRecord } =\n\t\t\tselect( coreStore );\n\t\tconst dirtyEntityRecords = __experimentalGetDirtyEntityRecords();\n\t\tconst { isSaveViewOpened } = select( editSiteStore );\n\t\treturn {\n\t\t\tisDirty: dirtyEntityRecords.length > 0,\n\t\t\tisSaving: dirtyEntityRecords.some( ( record ) =>\n\t\t\t\tisSavingEntityRecord( record.kind, record.name, record.key )\n\t\t\t),\n\t\t\tisSaveViewOpen: isSaveViewOpened(),\n\t\t};\n\t}, [] );\n\tconst { setIsSaveViewOpened } = useDispatch( editSiteStore );\n\n\tconst disabled = ! isDirty || isSaving;\n\n\tconst label = __( 'Save' );\n\n\treturn (\n\t\t<Button\n\t\t\tvariant=\"primary\"\n\t\t\tclassName=\"edit-site-save-button__button\"\n\t\t\taria-disabled={ disabled }\n\t\t\taria-expanded={ isSaveViewOpen }\n\t\t\tisBusy={ isSaving }\n\t\t\tonClick={ disabled ? undefined : () => setIsSaveViewOpened( true ) }\n\t\t\tlabel={ label }\n\t\t\t/*\n\t\t\t * We want the tooltip to show the keyboard shortcut only when the\n\t\t\t * button does something, i.e. when it's not disabled.\n\t\t\t */\n\t\t\tshortcut={ disabled ? undefined : displayShortcut.primary( 's' ) }\n\t\t\t/*\n\t\t\t * Displaying the keyboard shortcut conditionally makes the tooltip\n\t\t\t * itself show conditionally. This would trigger a full-rerendering\n\t\t\t * of the button that we want to avoid. By setting `showTooltip`,\n\t\t\t & the tooltip is always rendered even when there's no keyboard shortcut.\n\t\t\t */\n\t\t\tshowTooltip\n\t\t>\n\t\t\t{ label }\n\t\t</Button>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/save-button/index.js"],"names":["SaveButton","className","variant","showTooltip","icon","isDirty","isSaving","isSaveViewOpen","select","__experimentalGetDirtyEntityRecords","isSavingEntityRecord","coreStore","dirtyEntityRecords","isSaveViewOpened","editSiteStore","length","some","record","kind","name","key","setIsSaveViewOpened","activateSaveEnabled","disabled","getLabel","label","undefined","displayShortcut","primary"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AACA;;AAbA;AACA;AACA;;AAOA;AACA;AACA;AAIe,SAASA,UAAT,OAKX;AAAA,MALgC;AACnCC,IAAAA,SAAS,GAAG,+BADuB;AAEnCC,IAAAA,OAAO,GAAG,SAFyB;AAGnCC,IAAAA,WAAW,GAAG,IAHqB;AAInCC,IAAAA;AAJmC,GAKhC;AACH,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA,QAAX;AAAqBC,IAAAA;AAArB,MAAwC,qBAAaC,MAAF,IAAc;AACtE,UAAM;AAAEC,MAAAA,mCAAF;AAAuCC,MAAAA;AAAvC,QACLF,MAAM,CAAEG,eAAF,CADP;;AAEA,UAAMC,kBAAkB,GAAGH,mCAAmC,EAA9D;;AACA,UAAM;AAAEI,MAAAA;AAAF,QAAuBL,MAAM,CAAEM,YAAF,CAAnC;AACA,WAAO;AACNT,MAAAA,OAAO,EAAEO,kBAAkB,CAACG,MAAnB,GAA4B,CAD/B;AAENT,MAAAA,QAAQ,EAAEM,kBAAkB,CAACI,IAAnB,CAA2BC,MAAF,IAClCP,oBAAoB,CAAEO,MAAM,CAACC,IAAT,EAAeD,MAAM,CAACE,IAAtB,EAA4BF,MAAM,CAACG,GAAnC,CADX,CAFJ;AAKNb,MAAAA,cAAc,EAAEM,gBAAgB;AAL1B,KAAP;AAOA,GAZ6C,EAY3C,EAZ2C,CAA9C;AAaA,QAAM;AAAEQ,IAAAA;AAAF,MAA0B,uBAAaP,YAAb,CAAhC;AAEA,QAAMQ,mBAAmB,GAAG,+CAAuBjB,OAAnD;AACA,QAAMkB,QAAQ,GAAGjB,QAAQ,IAAI,CAAEgB,mBAA/B;;AAEA,QAAME,QAAQ,GAAG,MAAM;AACtB,QAAKD,QAAL,EAAgB;AACf,aAAO,cAAI,OAAJ,CAAP;AACA;;AAED,QAAK,+CAAuBlB,OAA5B,EAAsC;AACrC,aAAO,cAAI,iBAAJ,CAAP;AACA,KAFD,MAEO,IAAK,2CAAL,EAA2B;AACjC,aAAO,cAAI,UAAJ,CAAP;AACA;;AAED,WAAO,cAAI,MAAJ,CAAP;AACA,GAZD;;AAaA,QAAMoB,KAAK,GAAGD,QAAQ,EAAtB;AAEA,SACC,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAGtB,OADX;AAEC,IAAA,SAAS,EAAGD,SAFb;AAGC,qBAAgBsB,QAHjB;AAIC,qBAAgBhB,cAJjB;AAKC,IAAA,MAAM,EAAGD,QALV;AAMC,IAAA,OAAO,EAAGiB,QAAQ,GAAGG,SAAH,GAAe,MAAML,mBAAmB,CAAE,IAAF,CAN3D;AAOC,IAAA,KAAK,EAAGI;AACR;AACH;AACA;AACA;AAXE;AAYC,IAAA,QAAQ,EAAGF,QAAQ,GAAGG,SAAH,GAAeC,0BAAgBC,OAAhB,CAAyB,GAAzB;AAClC;AACH;AACA;AACA;AACA;AACA;AAlBE;AAmBC,IAAA,WAAW,EAAGzB,WAnBf;AAoBC,IAAA,IAAI,EAAGC;AApBR,KAsBGqB,KAtBH,CADD;AA0BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { Button } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { displayShortcut } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport { isPreviewingTheme } from '../../utils/is-previewing-theme';\n\nexport default function SaveButton( {\n\tclassName = 'edit-site-save-button__button',\n\tvariant = 'primary',\n\tshowTooltip = true,\n\ticon,\n} ) {\n\tconst { isDirty, isSaving, isSaveViewOpen } = useSelect( ( select ) => {\n\t\tconst { __experimentalGetDirtyEntityRecords, isSavingEntityRecord } =\n\t\t\tselect( coreStore );\n\t\tconst dirtyEntityRecords = __experimentalGetDirtyEntityRecords();\n\t\tconst { isSaveViewOpened } = select( editSiteStore );\n\t\treturn {\n\t\t\tisDirty: dirtyEntityRecords.length > 0,\n\t\t\tisSaving: dirtyEntityRecords.some( ( record ) =>\n\t\t\t\tisSavingEntityRecord( record.kind, record.name, record.key )\n\t\t\t),\n\t\t\tisSaveViewOpen: isSaveViewOpened(),\n\t\t};\n\t}, [] );\n\tconst { setIsSaveViewOpened } = useDispatch( editSiteStore );\n\n\tconst activateSaveEnabled = isPreviewingTheme() || isDirty;\n\tconst disabled = isSaving || ! activateSaveEnabled;\n\n\tconst getLabel = () => {\n\t\tif ( disabled ) {\n\t\t\treturn __( 'Saved' );\n\t\t}\n\n\t\tif ( isPreviewingTheme() && isDirty ) {\n\t\t\treturn __( 'Activate & Save' );\n\t\t} else if ( isPreviewingTheme() ) {\n\t\t\treturn __( 'Activate' );\n\t\t}\n\n\t\treturn __( 'Save' );\n\t};\n\tconst label = getLabel();\n\n\treturn (\n\t\t<Button\n\t\t\tvariant={ variant }\n\t\t\tclassName={ className }\n\t\t\taria-disabled={ disabled }\n\t\t\taria-expanded={ isSaveViewOpen }\n\t\t\tisBusy={ isSaving }\n\t\t\tonClick={ disabled ? undefined : () => setIsSaveViewOpened( true ) }\n\t\t\tlabel={ label }\n\t\t\t/*\n\t\t\t * We want the tooltip to show the keyboard shortcut only when the\n\t\t\t * button does something, i.e. when it's not disabled.\n\t\t\t */\n\t\t\tshortcut={ disabled ? undefined : displayShortcut.primary( 's' ) }\n\t\t\t/*\n\t\t\t * Displaying the keyboard shortcut conditionally makes the tooltip\n\t\t\t * itself show conditionally. This would trigger a full-rerendering\n\t\t\t * of the button that we want to avoid. By setting `showTooltip`,\n\t\t\t & the tooltip is always rendered even when there's no keyboard shortcut.\n\t\t\t */\n\t\t\tshowTooltip={ showTooltip }\n\t\t\ticon={ icon }\n\t\t>\n\t\t\t{ label }\n\t\t</Button>\n\t);\n}\n"]}

package/build/components/save-hub/index.js

@@ -1,9 +1,11 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = SaveButton;
+exports.default = SaveHub;
 
 var _element = require("@wordpress/element");
 
@@ -15,11 +17,11 @@ var _i18n = require("@wordpress/i18n");
 
 var _coreData = require("@wordpress/core-data");
 
-var _keycodes = require("@wordpress/keycodes");
-
 var _icons = require("@wordpress/icons");
 
-var _store = require("../../store");
+var _saveButton = _interopRequireDefault(require("../save-button"));
+
+var _isPreviewingTheme = require("../../utils/is-previewing-theme");
 
 /**
  * WordPress dependencies
@@ -28,12 +30,11 @@ var _store = require("../../store");
 /**
  * Internal dependencies
  */
-function SaveButton() {
+function SaveHub() {
   const {
     countUnsavedChanges,
     isDirty,
-    isSaving,
-    isSaveViewOpen
+    isSaving
   } = (0, _data.useSelect)(select => {
     const {
       __experimentalGetDirtyEntityRecords,
@@ -42,41 +43,23 @@ function SaveButton() {
 
     const dirtyEntityRecords = __experimentalGetDirtyEntityRecords();
 
-    const {
-      isSaveViewOpened
-    } = select(_store.store);
     return {
       isDirty: dirtyEntityRecords.length > 0,
       isSaving: dirtyEntityRecords.some(record => isSavingEntityRecord(record.kind, record.name, record.key)),
-      isSaveViewOpen: isSaveViewOpened(),
       countUnsavedChanges: dirtyEntityRecords.length
     };
   }, []);
-  const {
-    setIsSaveViewOpened
-  } = (0, _data.useDispatch)(_store.store);
-  const disabled = !isDirty || isSaving;
-  const label = disabled ? (0, _i18n.__)('Saved') : (0, _i18n.__)('Save');
+  const disabled = isSaving || !isDirty && !(0, _isPreviewingTheme.isPreviewingTheme)();
   return (0, _element.createElement)(_components.__experimentalHStack, {
     className: "edit-site-save-hub",
     alignment: "right",
     spacing: 4
   }, isDirty && (0, _element.createElement)("span", null, (0, _i18n.sprintf)( // translators: %d: number of unsaved changes (number).
-  (0, _i18n._n)('%d unsaved change', '%d unsaved changes', countUnsavedChanges), countUnsavedChanges)), (0, _element.createElement)(_components.Button, {
+  (0, _i18n._n)('%d unsaved change', '%d unsaved changes', countUnsavedChanges), countUnsavedChanges)), (0, _element.createElement)(_saveButton.default, {
     className: "edit-site-save-hub__button",
-    variant: disabled ? undefined : 'primary',
-    "aria-disabled": disabled,
-    "aria-expanded": isSaveViewOpen,
-    isBusy: isSaving,
-    onClick: disabled ? undefined : () => setIsSaveViewOpened(true),
-    label: label
-    /*
-     * We want the tooltip to show the keyboard shortcut only when the
-     * button does something, i.e. when it's not disabled.
-     */
-    ,
-    shortcut: disabled ? undefined : _keycodes.displayShortcut.primary('s'),
-    icon: disabled ? _icons.check : undefined
-  }, label));
+    variant: disabled ? null : 'primary',
+    showTooltip: false,
+    icon: disabled ? _icons.check : null
+  }));
 }
 //# sourceMappingURL=index.js.map

package/build/components/save-hub/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/save-hub/index.js"],"names":["SaveButton","countUnsavedChanges","isDirty","isSaving","isSaveViewOpen","select","__experimentalGetDirtyEntityRecords","isSavingEntityRecord","coreStore","dirtyEntityRecords","isSaveViewOpened","editSiteStore","length","some","record","kind","name","key","setIsSaveViewOpened","disabled","label","undefined","displayShortcut","primary","check"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AAbA;AACA;AACA;;AAQA;AACA;AACA;AAGe,SAASA,UAAT,GAAsB;AACpC,QAAM;AAAEC,IAAAA,mBAAF;AAAuBC,IAAAA,OAAvB;AAAgCC,IAAAA,QAAhC;AAA0CC,IAAAA;AAA1C,MACL,qBAAaC,MAAF,IAAc;AACxB,UAAM;AACLC,MAAAA,mCADK;AAELC,MAAAA;AAFK,QAGFF,MAAM,CAAEG,eAAF,CAHV;;AAIA,UAAMC,kBAAkB,GAAGH,mCAAmC,EAA9D;;AACA,UAAM;AAAEI,MAAAA;AAAF,QAAuBL,MAAM,CAAEM,YAAF,CAAnC;AACA,WAAO;AACNT,MAAAA,OAAO,EAAEO,kBAAkB,CAACG,MAAnB,GAA4B,CAD/B;AAENT,MAAAA,QAAQ,EAAEM,kBAAkB,CAACI,IAAnB,CAA2BC,MAAF,IAClCP,oBAAoB,CAAEO,MAAM,CAACC,IAAT,EAAeD,MAAM,CAACE,IAAtB,EAA4BF,MAAM,CAACG,GAAnC,CADX,CAFJ;AAKNb,MAAAA,cAAc,EAAEM,gBAAgB,EAL1B;AAMNT,MAAAA,mBAAmB,EAAEQ,kBAAkB,CAACG;AANlC,KAAP;AAQA,GAfD,EAeG,EAfH,CADD;AAiBA,QAAM;AAAEM,IAAAA;AAAF,MAA0B,uBAAaP,YAAb,CAAhC;AAEA,QAAMQ,QAAQ,GAAG,CAAEjB,OAAF,IAAaC,QAA9B;AAEA,QAAMiB,KAAK,GAAGD,QAAQ,GAAG,cAAI,OAAJ,CAAH,GAAmB,cAAI,MAAJ,CAAzC;AAEA,SACC,4BAAC,gCAAD;AAAQ,IAAA,SAAS,EAAC,oBAAlB;AAAuC,IAAA,SAAS,EAAC,OAAjD;AAAyD,IAAA,OAAO,EAAG;AAAnE,KACGjB,OAAO,IACR,0CACG,oBACD;AACA,gBACC,mBADD,EAEC,oBAFD,EAGCD,mBAHD,CAFC,EAODA,mBAPC,CADH,CAFF,EAcC,4BAAC,kBAAD;AACC,IAAA,SAAS,EAAC,4BADX;AAEC,IAAA,OAAO,EAAGkB,QAAQ,GAAGE,SAAH,GAAe,SAFlC;AAGC,qBAAgBF,QAHjB;AAIC,qBAAgBf,cAJjB;AAKC,IAAA,MAAM,EAAGD,QALV;AAMC,IAAA,OAAO,EACNgB,QAAQ,GAAGE,SAAH,GAAe,MAAMH,mBAAmB,CAAE,IAAF,CAPlD;AASC,IAAA,KAAK,EAAGE;AACR;AACJ;AACA;AACA;AAbG;AAcC,IAAA,QAAQ,EACPD,QAAQ,GAAGE,SAAH,GAAeC,0BAAgBC,OAAhB,CAAyB,GAAzB,CAfzB;AAiBC,IAAA,IAAI,EAAGJ,QAAQ,GAAGK,YAAH,GAAWH;AAjB3B,KAmBGD,KAnBH,CAdD,CADD;AAsCA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { Button, __experimentalHStack as HStack } from '@wordpress/components';\nimport { sprintf, __, _n } from '@wordpress/i18n';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { displayShortcut } from '@wordpress/keycodes';\nimport { check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\n\nexport default function SaveButton() {\n\tconst { countUnsavedChanges, isDirty, isSaving, isSaveViewOpen } =\n\t\tuseSelect( ( select ) => {\n\t\t\tconst {\n\t\t\t\t__experimentalGetDirtyEntityRecords,\n\t\t\t\tisSavingEntityRecord,\n\t\t\t} = select( coreStore );\n\t\t\tconst dirtyEntityRecords = __experimentalGetDirtyEntityRecords();\n\t\t\tconst { isSaveViewOpened } = select( editSiteStore );\n\t\t\treturn {\n\t\t\t\tisDirty: dirtyEntityRecords.length > 0,\n\t\t\t\tisSaving: dirtyEntityRecords.some( ( record ) =>\n\t\t\t\t\tisSavingEntityRecord( record.kind, record.name, record.key )\n\t\t\t\t),\n\t\t\t\tisSaveViewOpen: isSaveViewOpened(),\n\t\t\t\tcountUnsavedChanges: dirtyEntityRecords.length,\n\t\t\t};\n\t\t}, [] );\n\tconst { setIsSaveViewOpened } = useDispatch( editSiteStore );\n\n\tconst disabled = ! isDirty || isSaving;\n\n\tconst label = disabled ? __( 'Saved' ) : __( 'Save' );\n\n\treturn (\n\t\t<HStack className=\"edit-site-save-hub\" alignment=\"right\" spacing={ 4 }>\n\t\t\t{ isDirty && (\n\t\t\t\t<span>\n\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t// translators: %d: number of unsaved changes (number).\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d unsaved change',\n\t\t\t\t\t\t\t'%d unsaved changes',\n\t\t\t\t\t\t\tcountUnsavedChanges\n\t\t\t\t\t\t),\n\t\t\t\t\t\tcountUnsavedChanges\n\t\t\t\t\t) }\n\t\t\t\t</span>\n\t\t\t) }\n\t\t\t<Button\n\t\t\t\tclassName=\"edit-site-save-hub__button\"\n\t\t\t\tvariant={ disabled ? undefined : 'primary' }\n\t\t\t\taria-disabled={ disabled }\n\t\t\t\taria-expanded={ isSaveViewOpen }\n\t\t\t\tisBusy={ isSaving }\n\t\t\t\tonClick={\n\t\t\t\t\tdisabled ? undefined : () => setIsSaveViewOpened( true )\n\t\t\t\t}\n\t\t\t\tlabel={ label }\n\t\t\t\t/*\n\t\t\t\t * We want the tooltip to show the keyboard shortcut only when the\n\t\t\t\t * button does something, i.e. when it's not disabled.\n\t\t\t\t */\n\t\t\t\tshortcut={\n\t\t\t\t\tdisabled ? undefined : displayShortcut.primary( 's' )\n\t\t\t\t}\n\t\t\t\ticon={ disabled ? check : undefined }\n\t\t\t>\n\t\t\t\t{ label }\n\t\t\t</Button>\n\t\t</HStack>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/save-hub/index.js"],"names":["SaveHub","countUnsavedChanges","isDirty","isSaving","select","__experimentalGetDirtyEntityRecords","isSavingEntityRecord","coreStore","dirtyEntityRecords","length","some","record","kind","name","key","disabled","check"],"mappings":";;;;;;;;;;;AAGA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AACA;;AAbA;AACA;AACA;;AAOA;AACA;AACA;AAIe,SAASA,OAAT,GAAmB;AACjC,QAAM;AAAEC,IAAAA,mBAAF;AAAuBC,IAAAA,OAAvB;AAAgCC,IAAAA;AAAhC,MAA6C,qBAChDC,MAAF,IAAc;AACb,UAAM;AACLC,MAAAA,mCADK;AAELC,MAAAA;AAFK,QAGFF,MAAM,CAAEG,eAAF,CAHV;;AAIA,UAAMC,kBAAkB,GAAGH,mCAAmC,EAA9D;;AACA,WAAO;AACNH,MAAAA,OAAO,EAAEM,kBAAkB,CAACC,MAAnB,GAA4B,CAD/B;AAENN,MAAAA,QAAQ,EAAEK,kBAAkB,CAACE,IAAnB,CAA2BC,MAAF,IAClCL,oBAAoB,CAAEK,MAAM,CAACC,IAAT,EAAeD,MAAM,CAACE,IAAtB,EAA4BF,MAAM,CAACG,GAAnC,CADX,CAFJ;AAKNb,MAAAA,mBAAmB,EAAEO,kBAAkB,CAACC;AALlC,KAAP;AAOA,GAdiD,EAelD,EAfkD,CAAnD;AAkBA,QAAMM,QAAQ,GAAGZ,QAAQ,IAAM,CAAED,OAAF,IAAa,CAAE,2CAA9C;AAEA,SACC,4BAAC,gCAAD;AAAQ,IAAA,SAAS,EAAC,oBAAlB;AAAuC,IAAA,SAAS,EAAC,OAAjD;AAAyD,IAAA,OAAO,EAAG;AAAnE,KACGA,OAAO,IACR,0CACG,oBACD;AACA,gBACC,mBADD,EAEC,oBAFD,EAGCD,mBAHD,CAFC,EAODA,mBAPC,CADH,CAFF,EAcC,4BAAC,mBAAD;AACC,IAAA,SAAS,EAAC,4BADX;AAEC,IAAA,OAAO,EAAGc,QAAQ,GAAG,IAAH,GAAU,SAF7B;AAGC,IAAA,WAAW,EAAG,KAHf;AAIC,IAAA,IAAI,EAAGA,QAAQ,GAAGC,YAAH,GAAW;AAJ3B,IAdD,CADD;AAuBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { __experimentalHStack as HStack } from '@wordpress/components';\nimport { sprintf, _n } from '@wordpress/i18n';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport SaveButton from '../save-button';\nimport { isPreviewingTheme } from '../../utils/is-previewing-theme';\n\nexport default function SaveHub() {\n\tconst { countUnsavedChanges, isDirty, isSaving } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\t__experimentalGetDirtyEntityRecords,\n\t\t\t\tisSavingEntityRecord,\n\t\t\t} = select( coreStore );\n\t\t\tconst dirtyEntityRecords = __experimentalGetDirtyEntityRecords();\n\t\t\treturn {\n\t\t\t\tisDirty: dirtyEntityRecords.length > 0,\n\t\t\t\tisSaving: dirtyEntityRecords.some( ( record ) =>\n\t\t\t\t\tisSavingEntityRecord( record.kind, record.name, record.key )\n\t\t\t\t),\n\t\t\t\tcountUnsavedChanges: dirtyEntityRecords.length,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\n\tconst disabled = isSaving || ( ! isDirty && ! isPreviewingTheme() );\n\n\treturn (\n\t\t<HStack className=\"edit-site-save-hub\" alignment=\"right\" spacing={ 4 }>\n\t\t\t{ isDirty && (\n\t\t\t\t<span>\n\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t// translators: %d: number of unsaved changes (number).\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d unsaved change',\n\t\t\t\t\t\t\t'%d unsaved changes',\n\t\t\t\t\t\t\tcountUnsavedChanges\n\t\t\t\t\t\t),\n\t\t\t\t\t\tcountUnsavedChanges\n\t\t\t\t\t) }\n\t\t\t\t</span>\n\t\t\t) }\n\t\t\t<SaveButton\n\t\t\t\tclassName=\"edit-site-save-hub__button\"\n\t\t\t\tvariant={ disabled ? null : 'primary' }\n\t\t\t\tshowTooltip={ false }\n\t\t\t\ticon={ disabled ? check : null }\n\t\t\t/>\n\t\t</HStack>\n\t);\n}\n"]}

package/build/components/save-panel/index.js

@@ -25,6 +25,8 @@ var _store = require("../../store");
 
 var _privateApis = require("../../private-apis");
 
+var _useActivateTheme = require("../../utils/use-activate-theme");
+
 /**
  * External dependencies
  */
@@ -37,6 +39,8 @@ var _privateApis = require("../../private-apis");
  * Internal dependencies
  */
 function SavePanel() {
+  var _window;
+
   const {
     isSaveViewOpen,
     canvasMode
@@ -55,28 +59,37 @@ function SavePanel() {
   const {
     setIsSaveViewOpened
   } = (0, _data.useDispatch)(_store.store);
+  const activateTheme = (0, _useActivateTheme.useActivateTheme)();
 
   const onClose = () => setIsSaveViewOpened(false);
 
+  const onSave = async values => {
+    await activateTheme();
+    return values;
+  };
+
+  const entitySavedStates = (_window = window) !== null && _window !== void 0 && _window.__experimentalEnableThemePreviews ? (0, _element.createElement)(_editor.EntitiesSavedStates, {
+    close: onClose,
+    onSave: onSave
+  }) : (0, _element.createElement)(_editor.EntitiesSavedStates, {
+    close: onClose
+  });
+
   if (canvasMode === 'view') {
     return isSaveViewOpen ? (0, _element.createElement)(_components.Modal, {
       className: "edit-site-save-panel__modal",
       onRequestClose: onClose,
       __experimentalHideHeader: true,
       contentLabel: (0, _i18n.__)('Save site, content, and template changes')
-    }, (0, _element.createElement)(_editor.EntitiesSavedStates, {
-      close: onClose
-    })) : null;
+    }, entitySavedStates) : null;
   }
 
   return (0, _element.createElement)(_interface.NavigableRegion, {
     className: (0, _classnames.default)('edit-site-layout__actions', {
       'is-entity-save-view-open': isSaveViewOpen
     }),
-    ariaLabel: (0, _i18n.__)('Save sidebar')
-  }, isSaveViewOpen ? (0, _element.createElement)(_editor.EntitiesSavedStates, {
-    close: onClose
-  }) : (0, _element.createElement)("div", {
+    ariaLabel: (0, _i18n.__)('Save panel')
+  }, isSaveViewOpen ? entitySavedStates : (0, _element.createElement)("div", {
     className: "edit-site-editor__toggle-save-panel"
   }, (0, _element.createElement)(_components.Button, {
     variant: "secondary",

package/build/components/save-panel/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/save-panel/index.js"],"names":["SavePanel","isSaveViewOpen","canvasMode","select","isSaveViewOpened","getCanvasMode","editSiteStore","setIsSaveViewOpened","onClose"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AACA;;AAlBA;AACA;AACA;;AAGA;AACA;AACA;;AAOA;AACA;AACA;AAIe,SAASA,SAAT,GAAqB;AACnC,QAAM;AAAEC,IAAAA,cAAF;AAAkBC,IAAAA;AAAlB,MAAiC,qBAAaC,MAAF,IAAc;AAC/D,UAAM;AAAEC,MAAAA,gBAAF;AAAoBC,MAAAA;AAApB,QAAsC,yBAC3CF,MAAM,CAAEG,YAAF,CADqC,CAA5C,CAD+D,CAK/D;AACA;;AACA,WAAO;AACNL,MAAAA,cAAc,EAAEG,gBAAgB,EAD1B;AAENF,MAAAA,UAAU,EAAEG,aAAa;AAFnB,KAAP;AAIA,GAXsC,EAWpC,EAXoC,CAAvC;AAYA,QAAM;AAAEE,IAAAA;AAAF,MAA0B,uBAAaD,YAAb,CAAhC;;AACA,QAAME,OAAO,GAAG,MAAMD,mBAAmB,CAAE,KAAF,CAAzC;;AAEA,MAAKL,UAAU,KAAK,MAApB,EAA6B;AAC5B,WAAOD,cAAc,GACpB,4BAAC,iBAAD;AACC,MAAA,SAAS,EAAC,6BADX;AAEC,MAAA,cAAc,EAAGO,OAFlB;AAGC,MAAA,wBAAwB,MAHzB;AAIC,MAAA,YAAY,EAAG,cACd,0CADc;AAJhB,OAQC,4BAAC,2BAAD;AAAqB,MAAA,KAAK,EAAGA;AAA7B,MARD,CADoB,GAWjB,IAXJ;AAYA;;AAED,SACC,4BAAC,0BAAD;AACC,IAAA,SAAS,EAAG,yBAAY,2BAAZ,EAAyC;AACpD,kCAA4BP;AADwB,KAAzC,CADb;AAIC,IAAA,SAAS,EAAG,cAAI,cAAJ;AAJb,KAMGA,cAAc,GACf,4BAAC,2BAAD;AAAqB,IAAA,KAAK,EAAGO;AAA7B,IADe,GAGf;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAC,WADT;AAEC,IAAA,SAAS,EAAC,4CAFX;AAGC,IAAA,OAAO,EAAG,MAAMD,mBAAmB,CAAE,IAAF,CAHpC;AAIC,qBAAgB;AAJjB,KAMG,cAAI,iBAAJ,CANH,CADD,CATF,CADD;AAuBA","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Button, Modal } from '@wordpress/components';\nimport { EntitiesSavedStates } from '@wordpress/editor';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { NavigableRegion } from '@wordpress/interface';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport { unlock } from '../../private-apis';\n\nexport default function SavePanel() {\n\tconst { isSaveViewOpen, canvasMode } = useSelect( ( select ) => {\n\t\tconst { isSaveViewOpened, getCanvasMode } = unlock(\n\t\t\tselect( editSiteStore )\n\t\t);\n\n\t\t// The currently selected entity to display.\n\t\t// Typically template or template part in the site editor.\n\t\treturn {\n\t\t\tisSaveViewOpen: isSaveViewOpened(),\n\t\t\tcanvasMode: getCanvasMode(),\n\t\t};\n\t}, [] );\n\tconst { setIsSaveViewOpened } = useDispatch( editSiteStore );\n\tconst onClose = () => setIsSaveViewOpened( false );\n\n\tif ( canvasMode === 'view' ) {\n\t\treturn isSaveViewOpen ? (\n\t\t\t<Modal\n\t\t\t\tclassName=\"edit-site-save-panel__modal\"\n\t\t\t\tonRequestClose={ onClose }\n\t\t\t\t__experimentalHideHeader\n\t\t\t\tcontentLabel={ __(\n\t\t\t\t\t'Save site, content, and template changes'\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<EntitiesSavedStates close={ onClose } />\n\t\t\t</Modal>\n\t\t) : null;\n\t}\n\n\treturn (\n\t\t<NavigableRegion\n\t\t\tclassName={ classnames( 'edit-site-layout__actions', {\n\t\t\t\t'is-entity-save-view-open': isSaveViewOpen,\n\t\t\t} ) }\n\t\t\tariaLabel={ __( 'Save sidebar' ) }\n\t\t>\n\t\t\t{ isSaveViewOpen ? (\n\t\t\t\t<EntitiesSavedStates close={ onClose } />\n\t\t\t) : (\n\t\t\t\t<div className=\"edit-site-editor__toggle-save-panel\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\tclassName=\"edit-site-editor__toggle-save-panel-button\"\n\t\t\t\t\t\tonClick={ () => setIsSaveViewOpened( true ) }\n\t\t\t\t\t\taria-expanded={ false }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Open save panel' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</NavigableRegion>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/save-panel/index.js"],"names":["SavePanel","isSaveViewOpen","canvasMode","select","isSaveViewOpened","getCanvasMode","editSiteStore","setIsSaveViewOpened","activateTheme","onClose","onSave","values","entitySavedStates","window","__experimentalEnableThemePreviews"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AACA;;AACA;;AAnBA;AACA;AACA;;AAGA;AACA;AACA;;AAOA;AACA;AACA;AAKe,SAASA,SAAT,GAAqB;AAAA;;AACnC,QAAM;AAAEC,IAAAA,cAAF;AAAkBC,IAAAA;AAAlB,MAAiC,qBAAaC,MAAF,IAAc;AAC/D,UAAM;AAAEC,MAAAA,gBAAF;AAAoBC,MAAAA;AAApB,QAAsC,yBAC3CF,MAAM,CAAEG,YAAF,CADqC,CAA5C,CAD+D,CAK/D;AACA;;AACA,WAAO;AACNL,MAAAA,cAAc,EAAEG,gBAAgB,EAD1B;AAENF,MAAAA,UAAU,EAAEG,aAAa;AAFnB,KAAP;AAIA,GAXsC,EAWpC,EAXoC,CAAvC;AAYA,QAAM;AAAEE,IAAAA;AAAF,MAA0B,uBAAaD,YAAb,CAAhC;AACA,QAAME,aAAa,GAAG,yCAAtB;;AACA,QAAMC,OAAO,GAAG,MAAMF,mBAAmB,CAAE,KAAF,CAAzC;;AACA,QAAMG,MAAM,GAAG,MAAQC,MAAR,IAAoB;AAClC,UAAMH,aAAa,EAAnB;AACA,WAAOG,MAAP;AACA,GAHD;;AAKA,QAAMC,iBAAiB,GAAG,WAAAC,MAAM,UAAN,kCAAQC,iCAAR,GACzB,4BAAC,2BAAD;AAAqB,IAAA,KAAK,EAAGL,OAA7B;AAAuC,IAAA,MAAM,EAAGC;AAAhD,IADyB,GAGzB,4BAAC,2BAAD;AAAqB,IAAA,KAAK,EAAGD;AAA7B,IAHD;;AAMA,MAAKP,UAAU,KAAK,MAApB,EAA6B;AAC5B,WAAOD,cAAc,GACpB,4BAAC,iBAAD;AACC,MAAA,SAAS,EAAC,6BADX;AAEC,MAAA,cAAc,EAAGQ,OAFlB;AAGC,MAAA,wBAAwB,MAHzB;AAIC,MAAA,YAAY,EAAG,cACd,0CADc;AAJhB,OAQGG,iBARH,CADoB,GAWjB,IAXJ;AAYA;;AAED,SACC,4BAAC,0BAAD;AACC,IAAA,SAAS,EAAG,yBAAY,2BAAZ,EAAyC;AACpD,kCAA4BX;AADwB,KAAzC,CADb;AAIC,IAAA,SAAS,EAAG,cAAI,YAAJ;AAJb,KAMGA,cAAc,GACfW,iBADe,GAGf;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAC,WADT;AAEC,IAAA,SAAS,EAAC,4CAFX;AAGC,IAAA,OAAO,EAAG,MAAML,mBAAmB,CAAE,IAAF,CAHpC;AAIC,qBAAgB;AAJjB,KAMG,cAAI,iBAAJ,CANH,CADD,CATF,CADD;AAuBA","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Button, Modal } from '@wordpress/components';\nimport { EntitiesSavedStates } from '@wordpress/editor';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { NavigableRegion } from '@wordpress/interface';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport { unlock } from '../../private-apis';\nimport { useActivateTheme } from '../../utils/use-activate-theme';\n\nexport default function SavePanel() {\n\tconst { isSaveViewOpen, canvasMode } = useSelect( ( select ) => {\n\t\tconst { isSaveViewOpened, getCanvasMode } = unlock(\n\t\t\tselect( editSiteStore )\n\t\t);\n\n\t\t// The currently selected entity to display.\n\t\t// Typically template or template part in the site editor.\n\t\treturn {\n\t\t\tisSaveViewOpen: isSaveViewOpened(),\n\t\t\tcanvasMode: getCanvasMode(),\n\t\t};\n\t}, [] );\n\tconst { setIsSaveViewOpened } = useDispatch( editSiteStore );\n\tconst activateTheme = useActivateTheme();\n\tconst onClose = () => setIsSaveViewOpened( false );\n\tconst onSave = async ( values ) => {\n\t\tawait activateTheme();\n\t\treturn values;\n\t};\n\n\tconst entitySavedStates = window?.__experimentalEnableThemePreviews ? (\n\t\t<EntitiesSavedStates close={ onClose } onSave={ onSave } />\n\t) : (\n\t\t<EntitiesSavedStates close={ onClose } />\n\t);\n\n\tif ( canvasMode === 'view' ) {\n\t\treturn isSaveViewOpen ? (\n\t\t\t<Modal\n\t\t\t\tclassName=\"edit-site-save-panel__modal\"\n\t\t\t\tonRequestClose={ onClose }\n\t\t\t\t__experimentalHideHeader\n\t\t\t\tcontentLabel={ __(\n\t\t\t\t\t'Save site, content, and template changes'\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t{ entitySavedStates }\n\t\t\t</Modal>\n\t\t) : null;\n\t}\n\n\treturn (\n\t\t<NavigableRegion\n\t\t\tclassName={ classnames( 'edit-site-layout__actions', {\n\t\t\t\t'is-entity-save-view-open': isSaveViewOpen,\n\t\t\t} ) }\n\t\t\tariaLabel={ __( 'Save panel' ) }\n\t\t>\n\t\t\t{ isSaveViewOpen ? (\n\t\t\t\tentitySavedStates\n\t\t\t) : (\n\t\t\t\t<div className=\"edit-site-editor__toggle-save-panel\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\tclassName=\"edit-site-editor__toggle-save-panel-button\"\n\t\t\t\t\t\tonClick={ () => setIsSaveViewOpened( true ) }\n\t\t\t\t\t\taria-expanded={ false }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Open save panel' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</NavigableRegion>\n\t);\n}\n"]}

package/build/components/secondary-sidebar/list-view-sidebar.js

@@ -46,24 +46,19 @@ function ListViewSidebar() {
     }
   }
 
-  const instanceId = (0, _compose.useInstanceId)(ListViewSidebar);
-  const labelId = `edit-site-editor__list-view-panel-label-${instanceId}`;
   const {
     PrivateListView
   } = (0, _privateApis.unlock)(_blockEditor.privateApis);
   return (// eslint-disable-next-line jsx-a11y/no-static-element-interactions
     (0, _element.createElement)("div", {
-      "aria-labelledby": labelId,
       className: "edit-site-editor__list-view-panel",
       onKeyDown: closeOnEscape
     }, (0, _element.createElement)("div", {
       className: "edit-site-editor__list-view-panel-header",
       ref: headerFocusReturnRef
-    }, (0, _element.createElement)("strong", {
-      id: labelId
-    }, (0, _i18n.__)('List View')), (0, _element.createElement)(_components.Button, {
+    }, (0, _element.createElement)("strong", null, (0, _i18n.__)('List View')), (0, _element.createElement)(_components.Button, {
       icon: _icons.closeSmall,
-      label: (0, _i18n.__)('Close List View Sidebar'),
+      label: (0, _i18n.__)('Close'),
       onClick: () => setIsListViewOpened(false)
     })), (0, _element.createElement)("div", {
       className: "edit-site-editor__list-view-panel-content",

package/build/components/secondary-sidebar/list-view-sidebar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/secondary-sidebar/list-view-sidebar.js"],"names":["ListViewSidebar","setIsListViewOpened","editSiteStore","focusOnMountRef","headerFocusReturnRef","contentFocusReturnRef","closeOnEscape","event","keyCode","ESCAPE","defaultPrevented","instanceId","labelId","PrivateListView","blockEditorPrivateApis","closeSmall"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AAMA;;AACA;;AACA;;AACA;;AAKA;;AACA;;AApBA;AACA;AACA;;AAcA;AACA;AACA;AAIe,SAASA,eAAT,GAA2B;AACzC,QAAM;AAAEC,IAAAA;AAAF,MAA0B,uBAAaC,YAAb,CAAhC;AAEA,QAAMC,eAAe,GAAG,8BAAiB,cAAjB,CAAxB;AACA,QAAMC,oBAAoB,GAAG,8BAA7B;AACA,QAAMC,qBAAqB,GAAG,8BAA9B;;AACA,WAASC,aAAT,CAAwBC,KAAxB,EAAgC;AAC/B,QAAKA,KAAK,CAACC,OAAN,KAAkBC,gBAAlB,IAA4B,CAAEF,KAAK,CAACG,gBAAzC,EAA4D;AAC3DT,MAAAA,mBAAmB,CAAE,KAAF,CAAnB;AACA;AACD;;AAED,QAAMU,UAAU,GAAG,4BAAeX,eAAf,CAAnB;AACA,QAAMY,OAAO,GAAI,2CAA2CD,UAAY,EAAxE;AACA,QAAM;AAAEE,IAAAA;AAAF,MAAsB,yBAAQC,wBAAR,CAA5B;AACA,SACC;AACA;AACC,yBAAkBF,OADnB;AAEC,MAAA,SAAS,EAAC,mCAFX;AAGC,MAAA,SAAS,EAAGN;AAHb,OAKC;AACC,MAAA,SAAS,EAAC,0CADX;AAEC,MAAA,GAAG,EAAGF;AAFP,OAIC;AAAQ,MAAA,EAAE,EAAGQ;AAAb,OAAyB,cAAI,WAAJ,CAAzB,CAJD,EAKC,4BAAC,kBAAD;AACC,MAAA,IAAI,EAAGG,iBADR;AAEC,MAAA,KAAK,EAAG,cAAI,yBAAJ,CAFT;AAGC,MAAA,OAAO,EAAG,MAAMd,mBAAmB,CAAE,KAAF;AAHpC,MALD,CALD,EAgBC;AACC,MAAA,SAAS,EAAC,2CADX;AAEC,MAAA,GAAG,EAAG,2BAAc,CACnBI,qBADmB,EAEnBF,eAFmB,CAAd;AAFP,OAOC,4BAAC,eAAD,OAPD,CAhBD;AAFD;AA6BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { Button } from '@wordpress/components';\nimport {\n\tuseFocusOnMount,\n\tuseFocusReturn,\n\tuseInstanceId,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { useDispatch } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { closeSmall } from '@wordpress/icons';\nimport { ESCAPE } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport { unlock } from '../../private-apis';\n\nexport default function ListViewSidebar() {\n\tconst { setIsListViewOpened } = useDispatch( editSiteStore );\n\n\tconst focusOnMountRef = useFocusOnMount( 'firstElement' );\n\tconst headerFocusReturnRef = useFocusReturn();\n\tconst contentFocusReturnRef = useFocusReturn();\n\tfunction closeOnEscape( event ) {\n\t\tif ( event.keyCode === ESCAPE && ! event.defaultPrevented ) {\n\t\t\tsetIsListViewOpened( false );\n\t\t}\n\t}\n\n\tconst instanceId = useInstanceId( ListViewSidebar );\n\tconst labelId = `edit-site-editor__list-view-panel-label-${ instanceId }`;\n\tconst { PrivateListView } = unlock( blockEditorPrivateApis );\n\treturn (\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\taria-labelledby={ labelId }\n\t\t\tclassName=\"edit-site-editor__list-view-panel\"\n\t\t\tonKeyDown={ closeOnEscape }\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName=\"edit-site-editor__list-view-panel-header\"\n\t\t\t\tref={ headerFocusReturnRef }\n\t\t\t>\n\t\t\t\t<strong id={ labelId }>{ __( 'List View' ) }</strong>\n\t\t\t\t<Button\n\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\tlabel={ __( 'Close List View Sidebar' ) }\n\t\t\t\t\tonClick={ () => setIsListViewOpened( false ) }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tclassName=\"edit-site-editor__list-view-panel-content\"\n\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\tcontentFocusReturnRef,\n\t\t\t\t\tfocusOnMountRef,\n\t\t\t\t] ) }\n\t\t\t>\n\t\t\t\t<PrivateListView />\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/secondary-sidebar/list-view-sidebar.js"],"names":["ListViewSidebar","setIsListViewOpened","editSiteStore","focusOnMountRef","headerFocusReturnRef","contentFocusReturnRef","closeOnEscape","event","keyCode","ESCAPE","defaultPrevented","PrivateListView","blockEditorPrivateApis","closeSmall"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AAKA;;AACA;;AAnBA;AACA;AACA;;AAaA;AACA;AACA;AAIe,SAASA,eAAT,GAA2B;AACzC,QAAM;AAAEC,IAAAA;AAAF,MAA0B,uBAAaC,YAAb,CAAhC;AAEA,QAAMC,eAAe,GAAG,8BAAiB,cAAjB,CAAxB;AACA,QAAMC,oBAAoB,GAAG,8BAA7B;AACA,QAAMC,qBAAqB,GAAG,8BAA9B;;AACA,WAASC,aAAT,CAAwBC,KAAxB,EAAgC;AAC/B,QAAKA,KAAK,CAACC,OAAN,KAAkBC,gBAAlB,IAA4B,CAAEF,KAAK,CAACG,gBAAzC,EAA4D;AAC3DT,MAAAA,mBAAmB,CAAE,KAAF,CAAnB;AACA;AACD;;AAED,QAAM;AAAEU,IAAAA;AAAF,MAAsB,yBAAQC,wBAAR,CAA5B;AACA,SACC;AACA;AACC,MAAA,SAAS,EAAC,mCADX;AAEC,MAAA,SAAS,EAAGN;AAFb,OAIC;AACC,MAAA,SAAS,EAAC,0CADX;AAEC,MAAA,GAAG,EAAGF;AAFP,OAIC,4CAAU,cAAI,WAAJ,CAAV,CAJD,EAKC,4BAAC,kBAAD;AACC,MAAA,IAAI,EAAGS,iBADR;AAEC,MAAA,KAAK,EAAG,cAAI,OAAJ,CAFT;AAGC,MAAA,OAAO,EAAG,MAAMZ,mBAAmB,CAAE,KAAF;AAHpC,MALD,CAJD,EAeC;AACC,MAAA,SAAS,EAAC,2CADX;AAEC,MAAA,GAAG,EAAG,2BAAc,CACnBI,qBADmB,EAEnBF,eAFmB,CAAd;AAFP,OAOC,4BAAC,eAAD,OAPD,CAfD;AAFD;AA4BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { Button } from '@wordpress/components';\nimport {\n\tuseFocusOnMount,\n\tuseFocusReturn,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { useDispatch } from '@wordpress/data';\nimport { __ } from '@wordpress/i18n';\nimport { closeSmall } from '@wordpress/icons';\nimport { ESCAPE } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport { unlock } from '../../private-apis';\n\nexport default function ListViewSidebar() {\n\tconst { setIsListViewOpened } = useDispatch( editSiteStore );\n\n\tconst focusOnMountRef = useFocusOnMount( 'firstElement' );\n\tconst headerFocusReturnRef = useFocusReturn();\n\tconst contentFocusReturnRef = useFocusReturn();\n\tfunction closeOnEscape( event ) {\n\t\tif ( event.keyCode === ESCAPE && ! event.defaultPrevented ) {\n\t\t\tsetIsListViewOpened( false );\n\t\t}\n\t}\n\n\tconst { PrivateListView } = unlock( blockEditorPrivateApis );\n\treturn (\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tclassName=\"edit-site-editor__list-view-panel\"\n\t\t\tonKeyDown={ closeOnEscape }\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName=\"edit-site-editor__list-view-panel-header\"\n\t\t\t\tref={ headerFocusReturnRef }\n\t\t\t>\n\t\t\t\t<strong>{ __( 'List View' ) }</strong>\n\t\t\t\t<Button\n\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\tlabel={ __( 'Close' ) }\n\t\t\t\t\tonClick={ () => setIsListViewOpened( false ) }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tclassName=\"edit-site-editor__list-view-panel-content\"\n\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\tcontentFocusReturnRef,\n\t\t\t\t\tfocusOnMountRef,\n\t\t\t\t] ) }\n\t\t\t>\n\t\t\t\t<PrivateListView />\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"]}

package/build/components/sidebar/index.js

@@ -11,6 +11,8 @@ var _element = require("@wordpress/element");
 
 var _components = require("@wordpress/components");
 
+var _router = require("@wordpress/router");
+
 var _sidebarNavigationScreenMain = _interopRequireDefault(require("../sidebar-navigation-screen-main"));
 
 var _sidebarNavigationScreenTemplates = _interopRequireDefault(require("../sidebar-navigation-screen-templates"));
@@ -29,7 +31,11 @@ var _saveHub = _interopRequireDefault(require("../save-hub"));
 
 var _sidebarNavigationScreenNavigationItem = _interopRequireDefault(require("../sidebar-navigation-screen-navigation-item"));
 
-var _routes = require("../routes");
+var _privateApis = require("../../private-apis");
+
+var _sidebarNavigationScreenPages = _interopRequireDefault(require("../sidebar-navigation-screen-pages"));
+
+var _sidebarNavigationScreenPage = _interopRequireDefault(require("../sidebar-navigation-screen-page"));
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -42,6 +48,10 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 /**
  * Internal dependencies
  */
+const {
+  useLocation
+} = (0, _privateApis.unlock)(_router.privateApis);
+
 function SidebarScreens() {
   (0, _useSyncPathWithUrl.default)();
   return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.__experimentalNavigatorScreen, {
@@ -53,6 +63,10 @@ function SidebarScreens() {
   }, (0, _element.createElement)(_sidebarNavigationScreenGlobalStyles.default, null)), (0, _element.createElement)(_components.__experimentalNavigatorScreen, {
     path: "/navigation/:postType/:postId"
   }, (0, _element.createElement)(_sidebarNavigationScreenNavigationItem.default, null)), (0, _element.createElement)(_components.__experimentalNavigatorScreen, {
+    path: "/page"
+  }, (0, _element.createElement)(_sidebarNavigationScreenPages.default, null)), (0, _element.createElement)(_components.__experimentalNavigatorScreen, {
+    path: "/page/:postId"
+  }, (0, _element.createElement)(_sidebarNavigationScreenPage.default, null)), (0, _element.createElement)(_components.__experimentalNavigatorScreen, {
     path: "/:postType(wp_template|wp_template_part)"
   }, (0, _element.createElement)(_sidebarNavigationScreenTemplates.default, null)), (0, _element.createElement)(_components.__experimentalNavigatorScreen, {
     path: "/:postType(wp_template|wp_template_part)/all"
@@ -64,7 +78,7 @@ function SidebarScreens() {
 function Sidebar() {
   const {
     params: urlParams
-  } = (0, _routes.useLocation)();
+  } = useLocation();
   const initialPath = (0, _element.useRef)((0, _useSyncPathWithUrl.getPathFromURL)(urlParams));
   return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.__experimentalNavigatorProvider, {
     className: "edit-site-sidebar__content",

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar/index.js"],"names":["SidebarScreens","Sidebar","params","urlParams","initialPath","current"],"mappings":";;;;;;;;;AAGA;;AACA;;AAQA;;AACA;;AACA;;AACA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAvBA;AACA;AACA;;AAOA;AACA;AACA;AAcA,SAASA,cAAT,GAA0B;AACzB;AAEA,SACC,qDACC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,oCAAD,OADD,CADD,EAIC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,+CAAD,OADD,CAJD,EAOC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,4CAAD,OADD,CAPD,EAUC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,8CAAD,OADD,CAVD,EAaC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,yCAAD,OADD,CAbD,EAgBC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,+CAAD,OADD,CAhBD,EAmBC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,wCAAD,OADD,CAnBD,CADD;AAyBA;;AAED,SAASC,OAAT,GAAmB;AAClB,QAAM;AAAEC,IAAAA,MAAM,EAAEC;AAAV,MAAwB,0BAA9B;AACA,QAAMC,WAAW,GAAG,qBAAQ,wCAAgBD,SAAhB,CAAR,CAApB;AAEA,SACC,qDACC,4BAAC,2CAAD;AACC,IAAA,SAAS,EAAC,4BADX;AAEC,IAAA,WAAW,EAAGC,WAAW,CAACC;AAF3B,KAIC,4BAAC,cAAD,OAJD,CADD,EAOC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,4BAAC,gBAAD,OADD,CAPD,CADD;AAaA;;eAEc,mBAAMJ,OAAN,C","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { memo, useRef } from '@wordpress/element';\nimport {\n\t__experimentalNavigatorProvider as NavigatorProvider,\n\t__experimentalNavigatorScreen as NavigatorScreen,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport SidebarNavigationScreenMain from '../sidebar-navigation-screen-main';\nimport SidebarNavigationScreenTemplates from '../sidebar-navigation-screen-templates';\nimport SidebarNavigationScreenTemplate from '../sidebar-navigation-screen-template';\nimport useSyncPathWithURL, {\n\tgetPathFromURL,\n} from '../sync-state-with-url/use-sync-path-with-url';\nimport SidebarNavigationScreenNavigationMenus from '../sidebar-navigation-screen-navigation-menus';\nimport SidebarNavigationScreenGlobalStyles from '../sidebar-navigation-screen-global-styles';\nimport SidebarNavigationScreenTemplatesBrowse from '../sidebar-navigation-screen-templates-browse';\nimport SaveHub from '../save-hub';\nimport SidebarNavigationScreenNavigationItem from '../sidebar-navigation-screen-navigation-item';\nimport { useLocation } from '../routes';\n\nfunction SidebarScreens() {\n\tuseSyncPathWithURL();\n\n\treturn (\n\t\t<>\n\t\t\t<NavigatorScreen path=\"/\">\n\t\t\t\t<SidebarNavigationScreenMain />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/navigation\">\n\t\t\t\t<SidebarNavigationScreenNavigationMenus />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/wp_global_styles\">\n\t\t\t\t<SidebarNavigationScreenGlobalStyles />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/navigation/:postType/:postId\">\n\t\t\t\t<SidebarNavigationScreenNavigationItem />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/:postType(wp_template|wp_template_part)\">\n\t\t\t\t<SidebarNavigationScreenTemplates />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/:postType(wp_template|wp_template_part)/all\">\n\t\t\t\t<SidebarNavigationScreenTemplatesBrowse />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/:postType(wp_template|wp_template_part)/:postId\">\n\t\t\t\t<SidebarNavigationScreenTemplate />\n\t\t\t</NavigatorScreen>\n\t\t</>\n\t);\n}\n\nfunction Sidebar() {\n\tconst { params: urlParams } = useLocation();\n\tconst initialPath = useRef( getPathFromURL( urlParams ) );\n\n\treturn (\n\t\t<>\n\t\t\t<NavigatorProvider\n\t\t\t\tclassName=\"edit-site-sidebar__content\"\n\t\t\t\tinitialPath={ initialPath.current }\n\t\t\t>\n\t\t\t\t<SidebarScreens />\n\t\t\t</NavigatorProvider>\n\t\t\t<div className=\"edit-site-sidebar__footer\">\n\t\t\t\t<SaveHub />\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default memo( Sidebar );\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar/index.js"],"names":["useLocation","routerPrivateApis","SidebarScreens","Sidebar","params","urlParams","initialPath","current"],"mappings":";;;;;;;;;AAGA;;AACA;;AAIA;;AAKA;;AACA;;AACA;;AACA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AA1BA;AACA;AACA;;AAQA;AACA;AACA;AAgBA,MAAM;AAAEA,EAAAA;AAAF,IAAkB,yBAAQC,mBAAR,CAAxB;;AAEA,SAASC,cAAT,GAA0B;AACzB;AAEA,SACC,qDACC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,oCAAD,OADD,CADD,EAIC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,+CAAD,OADD,CAJD,EAOC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,4CAAD,OADD,CAPD,EAUC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,8CAAD,OADD,CAVD,EAaC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,qCAAD,OADD,CAbD,EAgBC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,oCAAD,OADD,CAhBD,EAmBC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,yCAAD,OADD,CAnBD,EAsBC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,+CAAD,OADD,CAtBD,EAyBC,4BAAC,yCAAD;AAAiB,IAAA,IAAI,EAAC;AAAtB,KACC,4BAAC,wCAAD,OADD,CAzBD,CADD;AA+BA;;AAED,SAASC,OAAT,GAAmB;AAClB,QAAM;AAAEC,IAAAA,MAAM,EAAEC;AAAV,MAAwBL,WAAW,EAAzC;AACA,QAAMM,WAAW,GAAG,qBAAQ,wCAAgBD,SAAhB,CAAR,CAApB;AAEA,SACC,qDACC,4BAAC,2CAAD;AACC,IAAA,SAAS,EAAC,4BADX;AAEC,IAAA,WAAW,EAAGC,WAAW,CAACC;AAF3B,KAIC,4BAAC,cAAD,OAJD,CADD,EAOC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC,4BAAC,gBAAD,OADD,CAPD,CADD;AAaA;;eAEc,mBAAMJ,OAAN,C","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { memo, useRef } from '@wordpress/element';\nimport {\n\t__experimentalNavigatorProvider as NavigatorProvider,\n\t__experimentalNavigatorScreen as NavigatorScreen,\n} from '@wordpress/components';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\n\n/**\n * Internal dependencies\n */\nimport SidebarNavigationScreenMain from '../sidebar-navigation-screen-main';\nimport SidebarNavigationScreenTemplates from '../sidebar-navigation-screen-templates';\nimport SidebarNavigationScreenTemplate from '../sidebar-navigation-screen-template';\nimport useSyncPathWithURL, {\n\tgetPathFromURL,\n} from '../sync-state-with-url/use-sync-path-with-url';\nimport SidebarNavigationScreenNavigationMenus from '../sidebar-navigation-screen-navigation-menus';\nimport SidebarNavigationScreenGlobalStyles from '../sidebar-navigation-screen-global-styles';\nimport SidebarNavigationScreenTemplatesBrowse from '../sidebar-navigation-screen-templates-browse';\nimport SaveHub from '../save-hub';\nimport SidebarNavigationScreenNavigationItem from '../sidebar-navigation-screen-navigation-item';\nimport { unlock } from '../../private-apis';\nimport SidebarNavigationScreenPages from '../sidebar-navigation-screen-pages';\nimport SidebarNavigationScreenPage from '../sidebar-navigation-screen-page';\n\nconst { useLocation } = unlock( routerPrivateApis );\n\nfunction SidebarScreens() {\n\tuseSyncPathWithURL();\n\n\treturn (\n\t\t<>\n\t\t\t<NavigatorScreen path=\"/\">\n\t\t\t\t<SidebarNavigationScreenMain />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/navigation\">\n\t\t\t\t<SidebarNavigationScreenNavigationMenus />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/wp_global_styles\">\n\t\t\t\t<SidebarNavigationScreenGlobalStyles />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/navigation/:postType/:postId\">\n\t\t\t\t<SidebarNavigationScreenNavigationItem />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/page\">\n\t\t\t\t<SidebarNavigationScreenPages />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/page/:postId\">\n\t\t\t\t<SidebarNavigationScreenPage />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/:postType(wp_template|wp_template_part)\">\n\t\t\t\t<SidebarNavigationScreenTemplates />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/:postType(wp_template|wp_template_part)/all\">\n\t\t\t\t<SidebarNavigationScreenTemplatesBrowse />\n\t\t\t</NavigatorScreen>\n\t\t\t<NavigatorScreen path=\"/:postType(wp_template|wp_template_part)/:postId\">\n\t\t\t\t<SidebarNavigationScreenTemplate />\n\t\t\t</NavigatorScreen>\n\t\t</>\n\t);\n}\n\nfunction Sidebar() {\n\tconst { params: urlParams } = useLocation();\n\tconst initialPath = useRef( getPathFromURL( urlParams ) );\n\n\treturn (\n\t\t<>\n\t\t\t<NavigatorProvider\n\t\t\t\tclassName=\"edit-site-sidebar__content\"\n\t\t\t\tinitialPath={ initialPath.current }\n\t\t\t>\n\t\t\t\t<SidebarScreens />\n\t\t\t</NavigatorProvider>\n\t\t\t<div className=\"edit-site-sidebar__footer\">\n\t\t\t\t<SaveHub />\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default memo( Sidebar );\n"]}

package/build/components/sidebar-edit-mode/global-styles-sidebar.js

@@ -17,6 +17,8 @@ var _icons = require("@wordpress/icons");
 
 var _data = require("@wordpress/data");
 
+var _interface = require("@wordpress/interface");
+
 var _defaultSidebar = _interopRequireDefault(require("./default-sidebar"));
 
 var _globalStyles = require("../global-styles");
@@ -25,6 +27,8 @@ var _store = require("../../store");
 
 var _ui = require("../global-styles/ui");
 
+var _privateApis = require("../../private-apis");
+
 /**
  * WordPress dependencies
  */
@@ -33,19 +37,41 @@ var _ui = require("../global-styles/ui");
  * Internal dependencies
  */
 function GlobalStylesSidebar() {
-  const [isStyleBookOpened, setIsStyleBookOpened] = (0, _element.useState)(false);
-  const editorMode = (0, _data.useSelect)(select => select(_store.store).getEditorMode(), []);
+  const {
+    shouldClearCanvasContainerView,
+    isStyleBookOpened
+  } = (0, _data.useSelect)(select => {
+    const {
+      getActiveComplementaryArea
+    } = select(_interface.store);
+    const {
+      getEditorCanvasContainerView,
+      getCanvasMode
+    } = (0, _privateApis.unlock)(select(_store.store));
+
+    const _isVisualEditorMode = 'visual' === select(_store.store).getEditorMode();
+
+    const _isEditCanvasMode = 'edit' === getCanvasMode();
+
+    return {
+      isStyleBookOpened: 'style-book' === getEditorCanvasContainerView(),
+      shouldClearCanvasContainerView: 'edit-site/global-styles' !== getActiveComplementaryArea('core/edit-site') || !_isVisualEditorMode || !_isEditCanvasMode
+    };
+  }, []);
+  const {
+    setEditorCanvasContainerView
+  } = (0, _privateApis.unlock)((0, _data.useDispatch)(_store.store));
   (0, _element.useEffect)(() => {
-    if (editorMode !== 'visual') {
-      setIsStyleBookOpened(false);
+    if (shouldClearCanvasContainerView) {
+      setEditorCanvasContainerView(undefined);
     }
-  }, [editorMode]);
+  }, [shouldClearCanvasContainerView]);
   return (0, _element.createElement)(_defaultSidebar.default, {
     className: "edit-site-global-styles-sidebar",
     identifier: "edit-site/global-styles",
     title: (0, _i18n.__)('Styles'),
     icon: _icons.styles,
-    closeLabel: (0, _i18n.__)('Close Styles sidebar'),
+    closeLabel: (0, _i18n.__)('Close Styles'),
     panelClassName: "edit-site-global-styles-sidebar__panel",
     header: (0, _element.createElement)(_components.Flex, {
       className: "edit-site-global-styles-sidebar__header"
@@ -57,14 +83,9 @@ function GlobalStylesSidebar() {
       icon: _icons.seen,
       label: (0, _i18n.__)('Style Book'),
       isPressed: isStyleBookOpened,
-      disabled: editorMode !== 'visual',
-      onClick: () => {
-        setIsStyleBookOpened(!isStyleBookOpened);
-      }
+      disabled: shouldClearCanvasContainerView,
+      onClick: () => setEditorCanvasContainerView(isStyleBookOpened ? undefined : 'style-book')
     })), (0, _element.createElement)(_components.FlexItem, null, (0, _element.createElement)(_ui.GlobalStylesMenuSlot, null)))
-  }, (0, _element.createElement)(_globalStyles.GlobalStylesUI, {
-    isStyleBookOpened: isStyleBookOpened,
-    onCloseStyleBook: () => setIsStyleBookOpened(false)
-  }));
+  }, (0, _element.createElement)(_globalStyles.GlobalStylesUI, null));
 }
 //# sourceMappingURL=global-styles-sidebar.js.map

package/build/components/sidebar-edit-mode/global-styles-sidebar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/global-styles-sidebar.js"],"names":["GlobalStylesSidebar","isStyleBookOpened","setIsStyleBookOpened","editorMode","select","editSiteStore","getEditorMode","styles","minWidth","seen"],"mappings":";;;;;;;;;AAQA;;AALA;;AACA;;AACA;;AACA;;AAOA;;AACA;;AACA;;AACA;;AAhBA;AACA;AACA;;AAQA;AACA;AACA;AAMe,SAASA,mBAAT,GAA+B;AAC7C,QAAM,CAAEC,iBAAF,EAAqBC,oBAArB,IAA8C,uBAAU,KAAV,CAApD;AACA,QAAMC,UAAU,GAAG,qBAChBC,MAAF,IAAcA,MAAM,CAAEC,YAAF,CAAN,CAAwBC,aAAxB,EADI,EAElB,EAFkB,CAAnB;AAKA,0BAAW,MAAM;AAChB,QAAKH,UAAU,KAAK,QAApB,EAA+B;AAC9BD,MAAAA,oBAAoB,CAAE,KAAF,CAApB;AACA;AACD,GAJD,EAIG,CAAEC,UAAF,CAJH;AAKA,SACC,4BAAC,uBAAD;AACC,IAAA,SAAS,EAAC,iCADX;AAEC,IAAA,UAAU,EAAC,yBAFZ;AAGC,IAAA,KAAK,EAAG,cAAI,QAAJ,CAHT;AAIC,IAAA,IAAI,EAAGI,aAJR;AAKC,IAAA,UAAU,EAAG,cAAI,sBAAJ,CALd;AAMC,IAAA,cAAc,EAAC,wCANhB;AAOC,IAAA,MAAM,EACL,4BAAC,gBAAD;AAAM,MAAA,SAAS,EAAC;AAAhB,OACC,4BAAC,qBAAD;AAAW,MAAA,KAAK,EAAG;AAAEC,QAAAA,QAAQ,EAAE;AAAZ;AAAnB,OACC,4CAAU,cAAI,QAAJ,CAAV,CADD,CADD,EAIC,4BAAC,oBAAD,QACC,4BAAC,kBAAD;AACC,MAAA,IAAI,EAAGC,WADR;AAEC,MAAA,KAAK,EAAG,cAAI,YAAJ,CAFT;AAGC,MAAA,SAAS,EAAGR,iBAHb;AAIC,MAAA,QAAQ,EAAGE,UAAU,KAAK,QAJ3B;AAKC,MAAA,OAAO,EAAG,MAAM;AACfD,QAAAA,oBAAoB,CAAE,CAAED,iBAAJ,CAApB;AACA;AAPF,MADD,CAJD,EAeC,4BAAC,oBAAD,QACC,4BAAC,wBAAD,OADD,CAfD;AARF,KA6BC,4BAAC,4BAAD;AACC,IAAA,iBAAiB,EAAGA,iBADrB;AAEC,IAAA,gBAAgB,EAAG,MAAMC,oBAAoB,CAAE,KAAF;AAF9C,IA7BD,CADD;AAoCA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { FlexItem, FlexBlock, Flex, Button } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { styles, seen } from '@wordpress/icons';\nimport { useSelect } from '@wordpress/data';\n\nimport { useState, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport DefaultSidebar from './default-sidebar';\nimport { GlobalStylesUI } from '../global-styles';\nimport { store as editSiteStore } from '../../store';\nimport { GlobalStylesMenuSlot } from '../global-styles/ui';\n\nexport default function GlobalStylesSidebar() {\n\tconst [ isStyleBookOpened, setIsStyleBookOpened ] = useState( false );\n\tconst editorMode = useSelect(\n\t\t( select ) => select( editSiteStore ).getEditorMode(),\n\t\t[]\n\t);\n\n\tuseEffect( () => {\n\t\tif ( editorMode !== 'visual' ) {\n\t\t\tsetIsStyleBookOpened( false );\n\t\t}\n\t}, [ editorMode ] );\n\treturn (\n\t\t<DefaultSidebar\n\t\t\tclassName=\"edit-site-global-styles-sidebar\"\n\t\t\tidentifier=\"edit-site/global-styles\"\n\t\t\ttitle={ __( 'Styles' ) }\n\t\t\ticon={ styles }\n\t\t\tcloseLabel={ __( 'Close Styles sidebar' ) }\n\t\t\tpanelClassName=\"edit-site-global-styles-sidebar__panel\"\n\t\t\theader={\n\t\t\t\t<Flex className=\"edit-site-global-styles-sidebar__header\">\n\t\t\t\t\t<FlexBlock style={ { minWidth: 'min-content' } }>\n\t\t\t\t\t\t<strong>{ __( 'Styles' ) }</strong>\n\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\ticon={ seen }\n\t\t\t\t\t\t\tlabel={ __( 'Style Book' ) }\n\t\t\t\t\t\t\tisPressed={ isStyleBookOpened }\n\t\t\t\t\t\t\tdisabled={ editorMode !== 'visual' }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetIsStyleBookOpened( ! isStyleBookOpened );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<GlobalStylesMenuSlot />\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t}\n\t\t>\n\t\t\t<GlobalStylesUI\n\t\t\t\tisStyleBookOpened={ isStyleBookOpened }\n\t\t\t\tonCloseStyleBook={ () => setIsStyleBookOpened( false ) }\n\t\t\t/>\n\t\t</DefaultSidebar>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/global-styles-sidebar.js"],"names":["GlobalStylesSidebar","shouldClearCanvasContainerView","isStyleBookOpened","select","getActiveComplementaryArea","interfaceStore","getEditorCanvasContainerView","getCanvasMode","editSiteStore","_isVisualEditorMode","getEditorMode","_isEditCanvasMode","setEditorCanvasContainerView","undefined","styles","minWidth","seen"],"mappings":";;;;;;;;;AAOA;;AAJA;;AACA;;AACA;;AACA;;AAEA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAjBA;AACA;AACA;;AAQA;AACA;AACA;AAOe,SAASA,mBAAT,GAA+B;AAC7C,QAAM;AAAEC,IAAAA,8BAAF;AAAkCC,IAAAA;AAAlC,MAAwD,qBAC3DC,MAAF,IAAc;AACb,UAAM;AAAEC,MAAAA;AAAF,QAAiCD,MAAM,CAAEE,gBAAF,CAA7C;AACA,UAAM;AAAEC,MAAAA,4BAAF;AAAgCC,MAAAA;AAAhC,QAAkD,yBACvDJ,MAAM,CAAEK,YAAF,CADiD,CAAxD;;AAGA,UAAMC,mBAAmB,GACxB,aAAaN,MAAM,CAAEK,YAAF,CAAN,CAAwBE,aAAxB,EADd;;AAEA,UAAMC,iBAAiB,GAAG,WAAWJ,aAAa,EAAlD;;AAEA,WAAO;AACNL,MAAAA,iBAAiB,EAChB,iBAAiBI,4BAA4B,EAFxC;AAGNL,MAAAA,8BAA8B,EAC7B,8BACCG,0BAA0B,CAAE,gBAAF,CAD3B,IAEA,CAAEK,mBAFF,IAGA,CAAEE;AAPG,KAAP;AASA,GAnB4D,EAoB7D,EApB6D,CAA9D;AAsBA,QAAM;AAAEC,IAAAA;AAAF,MAAmC,yBACxC,uBAAaJ,YAAb,CADwC,CAAzC;AAIA,0BAAW,MAAM;AAChB,QAAKP,8BAAL,EAAsC;AACrCW,MAAAA,4BAA4B,CAAEC,SAAF,CAA5B;AACA;AACD,GAJD,EAIG,CAAEZ,8BAAF,CAJH;AAMA,SACC,4BAAC,uBAAD;AACC,IAAA,SAAS,EAAC,iCADX;AAEC,IAAA,UAAU,EAAC,yBAFZ;AAGC,IAAA,KAAK,EAAG,cAAI,QAAJ,CAHT;AAIC,IAAA,IAAI,EAAGa,aAJR;AAKC,IAAA,UAAU,EAAG,cAAI,cAAJ,CALd;AAMC,IAAA,cAAc,EAAC,wCANhB;AAOC,IAAA,MAAM,EACL,4BAAC,gBAAD;AAAM,MAAA,SAAS,EAAC;AAAhB,OACC,4BAAC,qBAAD;AAAW,MAAA,KAAK,EAAG;AAAEC,QAAAA,QAAQ,EAAE;AAAZ;AAAnB,OACC,4CAAU,cAAI,QAAJ,CAAV,CADD,CADD,EAIC,4BAAC,oBAAD,QACC,4BAAC,kBAAD;AACC,MAAA,IAAI,EAAGC,WADR;AAEC,MAAA,KAAK,EAAG,cAAI,YAAJ,CAFT;AAGC,MAAA,SAAS,EAAGd,iBAHb;AAIC,MAAA,QAAQ,EAAGD,8BAJZ;AAKC,MAAA,OAAO,EAAG,MACTW,4BAA4B,CAC3BV,iBAAiB,GAAGW,SAAH,GAAe,YADL;AAN9B,MADD,CAJD,EAiBC,4BAAC,oBAAD,QACC,4BAAC,wBAAD,OADD,CAjBD;AARF,KA+BC,4BAAC,4BAAD,OA/BD,CADD;AAmCA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { FlexItem, FlexBlock, Flex, Button } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { styles, seen } from '@wordpress/icons';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect } from '@wordpress/element';\nimport { store as interfaceStore } from '@wordpress/interface';\n\n/**\n * Internal dependencies\n */\nimport DefaultSidebar from './default-sidebar';\nimport { GlobalStylesUI } from '../global-styles';\nimport { store as editSiteStore } from '../../store';\nimport { GlobalStylesMenuSlot } from '../global-styles/ui';\nimport { unlock } from '../../private-apis';\n\nexport default function GlobalStylesSidebar() {\n\tconst { shouldClearCanvasContainerView, isStyleBookOpened } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getActiveComplementaryArea } = select( interfaceStore );\n\t\t\tconst { getEditorCanvasContainerView, getCanvasMode } = unlock(\n\t\t\t\tselect( editSiteStore )\n\t\t\t);\n\t\t\tconst _isVisualEditorMode =\n\t\t\t\t'visual' === select( editSiteStore ).getEditorMode();\n\t\t\tconst _isEditCanvasMode = 'edit' === getCanvasMode();\n\n\t\t\treturn {\n\t\t\t\tisStyleBookOpened:\n\t\t\t\t\t'style-book' === getEditorCanvasContainerView(),\n\t\t\t\tshouldClearCanvasContainerView:\n\t\t\t\t\t'edit-site/global-styles' !==\n\t\t\t\t\t\tgetActiveComplementaryArea( 'core/edit-site' ) ||\n\t\t\t\t\t! _isVisualEditorMode ||\n\t\t\t\t\t! _isEditCanvasMode,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\tconst { setEditorCanvasContainerView } = unlock(\n\t\tuseDispatch( editSiteStore )\n\t);\n\n\tuseEffect( () => {\n\t\tif ( shouldClearCanvasContainerView ) {\n\t\t\tsetEditorCanvasContainerView( undefined );\n\t\t}\n\t}, [ shouldClearCanvasContainerView ] );\n\n\treturn (\n\t\t<DefaultSidebar\n\t\t\tclassName=\"edit-site-global-styles-sidebar\"\n\t\t\tidentifier=\"edit-site/global-styles\"\n\t\t\ttitle={ __( 'Styles' ) }\n\t\t\ticon={ styles }\n\t\t\tcloseLabel={ __( 'Close Styles' ) }\n\t\t\tpanelClassName=\"edit-site-global-styles-sidebar__panel\"\n\t\t\theader={\n\t\t\t\t<Flex className=\"edit-site-global-styles-sidebar__header\">\n\t\t\t\t\t<FlexBlock style={ { minWidth: 'min-content' } }>\n\t\t\t\t\t\t<strong>{ __( 'Styles' ) }</strong>\n\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\ticon={ seen }\n\t\t\t\t\t\t\tlabel={ __( 'Style Book' ) }\n\t\t\t\t\t\t\tisPressed={ isStyleBookOpened }\n\t\t\t\t\t\t\tdisabled={ shouldClearCanvasContainerView }\n\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\tsetEditorCanvasContainerView(\n\t\t\t\t\t\t\t\t\tisStyleBookOpened ? undefined : 'style-book'\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<GlobalStylesMenuSlot />\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t}\n\t\t>\n\t\t\t<GlobalStylesUI />\n\t\t</DefaultSidebar>\n\t);\n}\n"]}

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

@@ -30,8 +30,12 @@ var _constants = require("../../store/constants");
 
 var _settingsHeader = _interopRequireDefault(require("./settings-header"));
 
+var _templateRevisions = _interopRequireDefault(require("./template-revisions"));
+
 var _templateCard = _interopRequireDefault(require("./template-card"));
 
+var _pluginTemplateSettingPanel = _interopRequireDefault(require("../plugin-template-setting-panel"));
+
 var _constants2 = require("./constants");
 
 var _store = require("../../store");
@@ -91,12 +95,15 @@ function SidebarComplementaryAreaFills() {
     identifier: sidebarName,
     title: (0, _i18n.__)('Settings'),
     icon: (0, _i18n.isRTL)() ? _icons.drawerLeft : _icons.drawerRight,
-    closeLabel: (0, _i18n.__)('Close settings'),
+    closeLabel: (0, _i18n.__)('Close Settings'),
     header: (0, _element.createElement)(_settingsHeader.default, {
       sidebarName: sidebarName
     }),
     headerClassName: "edit-site-sidebar-edit-mode__panel-tabs"
-  }, sidebarName === _constants2.SIDEBAR_TEMPLATE && (0, _element.createElement)(_components.PanelBody, null, (0, _element.createElement)(_templateCard.default, null)), sidebarName === _constants2.SIDEBAR_BLOCK && (0, _element.createElement)(InspectorSlot, {
+  }, sidebarName === _constants2.SIDEBAR_TEMPLATE && (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.PanelBody, null, (0, _element.createElement)(_templateCard.default, null), (0, _element.createElement)(_components.PanelRow, {
+    header: (0, _i18n.__)('Editing history'),
+    className: "edit-site-template-revisions"
+  }, (0, _element.createElement)(_templateRevisions.default, null))), (0, _element.createElement)(_pluginTemplateSettingPanel.default.Slot, null)), sidebarName === _constants2.SIDEBAR_BLOCK && (0, _element.createElement)(InspectorSlot, {
     bubblesVirtually: true
   })), supportsGlobalStyles && (0, _element.createElement)(_globalStylesSidebar.default, null));
 }