@wordpress/edit-site 5.11.0 → 5.12.1

package/build/components/sidebar-edit-mode/page-panels/page-status.js

@@ -0,0 +1,192 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = PageStatus;
+
+var _element = require("@wordpress/element");
+
+var _components = require("@wordpress/components");
+
+var _i18n = require("@wordpress/i18n");
+
+var _data = require("@wordpress/data");
+
+var _coreData = require("@wordpress/core-data");
+
+var _notices = require("@wordpress/notices");
+
+var _blockEditor = require("@wordpress/block-editor");
+
+var _statusLabel = _interopRequireDefault(require("../../sidebar-navigation-screen-page/status-label"));
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+const STATUS_OPTIONS = [{
+  label: (0, _element.createElement)(_element.Fragment, null, (0, _i18n.__)('Draft'), (0, _element.createElement)(_components.__experimentalText, {
+    variant: "muted"
+  }, (0, _i18n.__)('Not ready to publish.'))),
+  value: 'draft'
+}, {
+  label: (0, _element.createElement)(_element.Fragment, null, (0, _i18n.__)('Pending'), (0, _element.createElement)(_components.__experimentalText, {
+    variant: "muted"
+  }, (0, _i18n.__)('Waiting for review before publishing.'))),
+  value: 'pending'
+}, {
+  label: (0, _element.createElement)(_element.Fragment, null, (0, _i18n.__)('Private'), (0, _element.createElement)(_components.__experimentalText, {
+    variant: "muted"
+  }, (0, _i18n.__)('Only visible to site admins and editors.'))),
+  value: 'private'
+}, {
+  label: (0, _element.createElement)(_element.Fragment, null, (0, _i18n.__)('Scheduled'), (0, _element.createElement)(_components.__experimentalText, {
+    variant: "muted"
+  }, (0, _i18n.__)('Publish automatically on a chosen date.'))),
+  value: 'future'
+}, {
+  label: (0, _element.createElement)(_element.Fragment, null, (0, _i18n.__)('Published'), (0, _element.createElement)(_components.__experimentalText, {
+    variant: "muted"
+  }, (0, _i18n.__)('Visible to everyone.'))),
+  value: 'publish'
+}];
+
+function PageStatus({
+  postType,
+  postId,
+  status,
+  password,
+  date
+}) {
+  const [showPassword, setShowPassword] = (0, _element.useState)(!!password);
+  const {
+    editEntityRecord
+  } = (0, _data.useDispatch)(_coreData.store);
+  const {
+    createErrorNotice
+  } = (0, _data.useDispatch)(_notices.store);
+  const [popoverAnchor, setPopoverAnchor] = (0, _element.useState)(null); // Memoize popoverProps to avoid returning a new object every time.
+
+  const popoverProps = (0, _element.useMemo)(() => ({
+    // Anchor the popover to the middle of the entire row so that it doesn't
+    // move around when the label changes.
+    anchor: popoverAnchor,
+    'aria-label': (0, _i18n.__)('Change status'),
+    placement: 'bottom-end'
+  }), [popoverAnchor]);
+
+  const saveStatus = async ({
+    status: newStatus = status,
+    password: newPassword = password,
+    date: newDate = date
+  }) => {
+    try {
+      await editEntityRecord('postType', postType, postId, {
+        status: newStatus,
+        date: newDate,
+        password: newPassword
+      });
+    } catch (error) {
+      const errorMessage = error.message && error.code !== 'unknown_error' ? error.message : (0, _i18n.__)('An error occurred while updating the status');
+      createErrorNotice(errorMessage, {
+        type: 'snackbar'
+      });
+    }
+  };
+
+  const handleTogglePassword = value => {
+    setShowPassword(value);
+
+    if (!value) {
+      saveStatus({
+        password: ''
+      });
+    }
+  };
+
+  const handleStatus = value => {
+    let newDate = date;
+    let newPassword = password;
+
+    if (value === 'publish') {
+      if (new Date(date) > new Date()) {
+        newDate = null;
+      }
+    } else if (value === 'future') {
+      if (!date || new Date(date) < new Date()) {
+        newDate = new Date();
+        newDate.setDate(newDate.getDate() + 7);
+      }
+    } else if (value === 'private' && password) {
+      setShowPassword(false);
+      newPassword = '';
+    }
+
+    saveStatus({
+      status: value,
+      date: newDate,
+      password: newPassword
+    });
+  };
+
+  return (0, _element.createElement)(_components.__experimentalHStack, {
+    className: "edit-site-summary-field"
+  }, (0, _element.createElement)(_components.__experimentalText, {
+    className: "edit-site-summary-field__label"
+  }, (0, _i18n.__)('Status')), (0, _element.createElement)(_components.Dropdown, {
+    contentClassName: "edit-site-change-status__content",
+    popoverProps: popoverProps,
+    focusOnMount: true,
+    ref: setPopoverAnchor,
+    renderToggle: ({
+      onToggle
+    }) => (0, _element.createElement)(_components.Button, {
+      className: "edit-site-summary-field__trigger",
+      variant: "tertiary",
+      onClick: onToggle
+    }, (0, _element.createElement)(_statusLabel.default, {
+      status: password ? 'protected' : status
+    })),
+    renderContent: ({
+      onClose
+    }) => (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_blockEditor.__experimentalInspectorPopoverHeader, {
+      title: (0, _i18n.__)('Status'),
+      onClose: onClose
+    }), (0, _element.createElement)("form", null, (0, _element.createElement)(_components.__experimentalVStack, {
+      spacing: 5
+    }, (0, _element.createElement)(_components.RadioControl, {
+      className: "edit-site-change-status__options",
+      hideLabelFromVision: true,
+      label: (0, _i18n.__)('Status'),
+      options: STATUS_OPTIONS,
+      onChange: handleStatus,
+      selected: status
+    }), status !== 'private' && (0, _element.createElement)(_components.BaseControl, {
+      id: `edit-site-change-status__password`,
+      label: (0, _i18n.__)('Password')
+    }, (0, _element.createElement)(_components.ToggleControl, {
+      label: (0, _i18n.__)('Hide this page behind a password'),
+      checked: showPassword,
+      onChange: handleTogglePassword
+    }), showPassword && (0, _element.createElement)(_components.TextControl, {
+      onChange: value => saveStatus({
+        password: value
+      }),
+      value: password
+      /* eslint-disable jsx-a11y/no-autofocus */
+      ,
+      autoFocus: !password
+      /* eslint-enable jsx-a11y/no-autofocus */
+      ,
+      placeholder: (0, _i18n.__)('Enter a secure password'),
+      type: "password"
+    })))))
+  }));
+}
+//# sourceMappingURL=page-status.js.map

package/build/components/sidebar-edit-mode/page-panels/page-status.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/page-panels/page-status.js"],"names":["STATUS_OPTIONS","label","value","PageStatus","postType","postId","status","password","date","showPassword","setShowPassword","editEntityRecord","coreStore","createErrorNotice","noticesStore","popoverAnchor","setPopoverAnchor","popoverProps","anchor","placement","saveStatus","newStatus","newPassword","newDate","error","errorMessage","message","code","type","handleTogglePassword","handleStatus","Date","setDate","getDate","onToggle","onClose"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tBaseControl,\n\tToggleControl,\n\tDropdown,\n\t__experimentalText as Text,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\tTextControl,\n\tRadioControl,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useDispatch } from '@wordpress/data';\nimport { useState, useMemo } from '@wordpress/element';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { __experimentalInspectorPopoverHeader as InspectorPopoverHeader } from '@wordpress/block-editor';\n/**\n * Internal dependencies\n */\nimport StatusLabel from '../../sidebar-navigation-screen-page/status-label';\n\nconst STATUS_OPTIONS = [\n\t{\n\t\tlabel: (\n\t\t\t<>\n\t\t\t\t{ __( 'Draft' ) }\n\t\t\t\t<Text variant=\"muted\">{ __( 'Not ready to publish.' ) }</Text>\n\t\t\t</>\n\t\t),\n\t\tvalue: 'draft',\n\t},\n\t{\n\t\tlabel: (\n\t\t\t<>\n\t\t\t\t{ __( 'Pending' ) }\n\t\t\t\t<Text variant=\"muted\">\n\t\t\t\t\t{ __( 'Waiting for review before publishing.' ) }\n\t\t\t\t</Text>\n\t\t\t</>\n\t\t),\n\t\tvalue: 'pending',\n\t},\n\t{\n\t\tlabel: (\n\t\t\t<>\n\t\t\t\t{ __( 'Private' ) }\n\t\t\t\t<Text variant=\"muted\">\n\t\t\t\t\t{ __( 'Only visible to site admins and editors.' ) }\n\t\t\t\t</Text>\n\t\t\t</>\n\t\t),\n\t\tvalue: 'private',\n\t},\n\t{\n\t\tlabel: (\n\t\t\t<>\n\t\t\t\t{ __( 'Scheduled' ) }\n\t\t\t\t<Text variant=\"muted\">\n\t\t\t\t\t{ __( 'Publish automatically on a chosen date.' ) }\n\t\t\t\t</Text>\n\t\t\t</>\n\t\t),\n\t\tvalue: 'future',\n\t},\n\t{\n\t\tlabel: (\n\t\t\t<>\n\t\t\t\t{ __( 'Published' ) }\n\t\t\t\t<Text variant=\"muted\">{ __( 'Visible to everyone.' ) }</Text>\n\t\t\t</>\n\t\t),\n\t\tvalue: 'publish',\n\t},\n];\n\nexport default function PageStatus( {\n\tpostType,\n\tpostId,\n\tstatus,\n\tpassword,\n\tdate,\n} ) {\n\tconst [ showPassword, setShowPassword ] = useState( !! password );\n\n\tconst { editEntityRecord } = useDispatch( coreStore );\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState( null );\n\t// Memoize popoverProps to avoid returning a new object every time.\n\tconst popoverProps = useMemo(\n\t\t() => ( {\n\t\t\t// Anchor the popover to the middle of the entire row so that it doesn't\n\t\t\t// move around when the label changes.\n\t\t\tanchor: popoverAnchor,\n\t\t\t'aria-label': __( 'Change status' ),\n\t\t\tplacement: 'bottom-end',\n\t\t} ),\n\t\t[ popoverAnchor ]\n\t);\n\n\tconst saveStatus = async ( {\n\t\tstatus: newStatus = status,\n\t\tpassword: newPassword = password,\n\t\tdate: newDate = date,\n\t} ) => {\n\t\ttry {\n\t\t\tawait editEntityRecord( 'postType', postType, postId, {\n\t\t\t\tstatus: newStatus,\n\t\t\t\tdate: newDate,\n\t\t\t\tpassword: newPassword,\n\t\t\t} );\n\t\t} catch ( error ) {\n\t\t\tconst errorMessage =\n\t\t\t\terror.message && error.code !== 'unknown_error'\n\t\t\t\t\t? error.message\n\t\t\t\t\t: __( 'An error occurred while updating the status' );\n\n\t\t\tcreateErrorNotice( errorMessage, {\n\t\t\t\ttype: 'snackbar',\n\t\t\t} );\n\t\t}\n\t};\n\n\tconst handleTogglePassword = ( value ) => {\n\t\tsetShowPassword( value );\n\t\tif ( ! value ) {\n\t\t\tsaveStatus( { password: '' } );\n\t\t}\n\t};\n\n\tconst handleStatus = ( value ) => {\n\t\tlet newDate = date;\n\t\tlet newPassword = password;\n\t\tif ( value === 'publish' ) {\n\t\t\tif ( new Date( date ) > new Date() ) {\n\t\t\t\tnewDate = null;\n\t\t\t}\n\t\t} else if ( value === 'future' ) {\n\t\t\tif ( ! date || new Date( date ) < new Date() ) {\n\t\t\t\tnewDate = new Date();\n\t\t\t\tnewDate.setDate( newDate.getDate() + 7 );\n\t\t\t}\n\t\t} else if ( value === 'private' && password ) {\n\t\t\tsetShowPassword( false );\n\t\t\tnewPassword = '';\n\t\t}\n\t\tsaveStatus( {\n\t\t\tstatus: value,\n\t\t\tdate: newDate,\n\t\t\tpassword: newPassword,\n\t\t} );\n\t};\n\n\treturn (\n\t\t<HStack className=\"edit-site-summary-field\">\n\t\t\t<Text className=\"edit-site-summary-field__label\">\n\t\t\t\t{ __( 'Status' ) }\n\t\t\t</Text>\n\t\t\t<Dropdown\n\t\t\t\tcontentClassName=\"edit-site-change-status__content\"\n\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\tfocusOnMount\n\t\t\t\tref={ setPopoverAnchor }\n\t\t\t\trenderToggle={ ( { onToggle } ) => (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName=\"edit-site-summary-field__trigger\"\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t>\n\t\t\t\t\t\t<StatusLabel\n\t\t\t\t\t\t\tstatus={ password ? 'protected' : status }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Button>\n\t\t\t\t) }\n\t\t\t\trenderContent={ ( { onClose } ) => (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<InspectorPopoverHeader\n\t\t\t\t\t\t\ttitle={ __( 'Status' ) }\n\t\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<form>\n\t\t\t\t\t\t\t<VStack spacing={ 5 }>\n\t\t\t\t\t\t\t\t<RadioControl\n\t\t\t\t\t\t\t\t\tclassName=\"edit-site-change-status__options\"\n\t\t\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Status' ) }\n\t\t\t\t\t\t\t\t\toptions={ STATUS_OPTIONS }\n\t\t\t\t\t\t\t\t\tonChange={ handleStatus }\n\t\t\t\t\t\t\t\t\tselected={ status }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{ status !== 'private' && (\n\t\t\t\t\t\t\t\t\t<BaseControl\n\t\t\t\t\t\t\t\t\t\tid={ `edit-site-change-status__password` }\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Password' ) }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<ToggleControl\n\t\t\t\t\t\t\t\t\t\t\tlabel={ __(\n\t\t\t\t\t\t\t\t\t\t\t\t'Hide this page behind a password'\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\tchecked={ showPassword }\n\t\t\t\t\t\t\t\t\t\t\tonChange={ handleTogglePassword }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t{ showPassword && (\n\t\t\t\t\t\t\t\t\t\t\t<TextControl\n\t\t\t\t\t\t\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\t\t\t\t\t\t\tsaveStatus( {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tpassword: value,\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\tvalue={ password }\n\t\t\t\t\t\t\t\t\t\t\t\t/* eslint-disable jsx-a11y/no-autofocus */\n\t\t\t\t\t\t\t\t\t\t\t\tautoFocus={ ! password }\n\t\t\t\t\t\t\t\t\t\t\t\t/* eslint-enable jsx-a11y/no-autofocus */\n\t\t\t\t\t\t\t\t\t\t\t\tplaceholder={ __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t'Enter a secure password'\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\ttype=\"password\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</BaseControl>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t</form>\n\t\t\t\t\t</>\n\t\t\t\t) }\n\t\t\t/>\n\t\t</HStack>\n\t);\n}\n"]}

package/build/components/sidebar-edit-mode/page-panels/page-summary.js

@@ -0,0 +1,45 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = PageSummary;
+
+var _element = require("@wordpress/element");
+
+var _components = require("@wordpress/components");
+
+var _pageStatus = _interopRequireDefault(require("./page-status"));
+
+var _publishDate = _interopRequireDefault(require("./publish-date"));
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+function PageSummary({
+  status,
+  date,
+  password,
+  postId,
+  postType
+}) {
+  return (0, _element.createElement)(_components.__experimentalVStack, null, (0, _element.createElement)(_pageStatus.default, {
+    status: status,
+    date: date,
+    password: password,
+    postId: postId,
+    postType: postType
+  }), (0, _element.createElement)(_publishDate.default, {
+    status: status,
+    date: date,
+    postId: postId,
+    postType: postType
+  }));
+}
+//# sourceMappingURL=page-summary.js.map

package/build/components/sidebar-edit-mode/page-panels/page-summary.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/page-panels/page-summary.js"],"names":["PageSummary","status","date","password","postId","postType"],"mappings":";;;;;;;;;;;AAGA;;AAIA;;AACA;;AARA;AACA;AACA;;AAEA;AACA;AACA;AAIe,SAASA,WAAT,CAAsB;AACpCC,EAAAA,MADoC;AAEpCC,EAAAA,IAFoC;AAGpCC,EAAAA,QAHoC;AAIpCC,EAAAA,MAJoC;AAKpCC,EAAAA;AALoC,CAAtB,EAMX;AACH,SACC,4BAAC,gCAAD,QACC,4BAAC,mBAAD;AACC,IAAA,MAAM,EAAGJ,MADV;AAEC,IAAA,IAAI,EAAGC,IAFR;AAGC,IAAA,QAAQ,EAAGC,QAHZ;AAIC,IAAA,MAAM,EAAGC,MAJV;AAKC,IAAA,QAAQ,EAAGC;AALZ,IADD,EAQC,4BAAC,oBAAD;AACC,IAAA,MAAM,EAAGJ,MADV;AAEC,IAAA,IAAI,EAAGC,IAFR;AAGC,IAAA,MAAM,EAAGE,MAHV;AAIC,IAAA,QAAQ,EAAGC;AAJZ,IARD,CADD;AAiBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalVStack as VStack } from '@wordpress/components';\n/**\n * Internal dependencies\n */\nimport PageStatus from './page-status';\nimport PublishDate from './publish-date';\n\nexport default function PageSummary( {\n\tstatus,\n\tdate,\n\tpassword,\n\tpostId,\n\tpostType,\n} ) {\n\treturn (\n\t\t<VStack>\n\t\t\t<PageStatus\n\t\t\t\tstatus={ status }\n\t\t\t\tdate={ date }\n\t\t\t\tpassword={ password }\n\t\t\t\tpostId={ postId }\n\t\t\t\tpostType={ postType }\n\t\t\t/>\n\t\t\t<PublishDate\n\t\t\t\tstatus={ status }\n\t\t\t\tdate={ date }\n\t\t\t\tpostId={ postId }\n\t\t\t\tpostType={ postType }\n\t\t\t/>\n\t\t</VStack>\n\t);\n}\n"]}

package/build/components/sidebar-edit-mode/page-panels/publish-date.js

@@ -0,0 +1,98 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = ChangeStatus;
+
+var _element = require("@wordpress/element");
+
+var _components = require("@wordpress/components");
+
+var _i18n = require("@wordpress/i18n");
+
+var _data = require("@wordpress/data");
+
+var _coreData = require("@wordpress/core-data");
+
+var _notices = require("@wordpress/notices");
+
+var _blockEditor = require("@wordpress/block-editor");
+
+var _date = require("@wordpress/date");
+
+/**
+ * WordPress dependencies
+ */
+function ChangeStatus({
+  postType,
+  postId,
+  status,
+  date
+}) {
+  const {
+    editEntityRecord
+  } = (0, _data.useDispatch)(_coreData.store);
+  const {
+    createErrorNotice
+  } = (0, _data.useDispatch)(_notices.store);
+  const [popoverAnchor, setPopoverAnchor] = (0, _element.useState)(null); // Memoize popoverProps to avoid returning a new object every time.
+
+  const popoverProps = (0, _element.useMemo)(() => ({
+    // Anchor the popover to the middle of the entire row so that it doesn't
+    // move around when the label changes.
+    anchor: popoverAnchor,
+    'aria-label': (0, _i18n.__)('Change publish date'),
+    placement: 'bottom-end'
+  }), [popoverAnchor]);
+
+  const saveDate = async newDate => {
+    try {
+      let newStatus = status;
+
+      if (status === 'future' && new Date(newDate) < new Date()) {
+        newStatus = 'publish';
+      } else if (status === 'publish' && new Date(newDate) > new Date()) {
+        newStatus = 'future';
+      }
+
+      await editEntityRecord('postType', postType, postId, {
+        status: newStatus,
+        date: newDate
+      });
+    } catch (error) {
+      const errorMessage = error.message && error.code !== 'unknown_error' ? error.message : (0, _i18n.__)('An error occurred while updating the status');
+      createErrorNotice(errorMessage, {
+        type: 'snackbar'
+      });
+    }
+  };
+
+  const relateToNow = date ? (0, _date.humanTimeDiff)(date) : (0, _i18n.__)('Immediately');
+  return (0, _element.createElement)(_components.__experimentalHStack, {
+    className: "edit-site-summary-field"
+  }, (0, _element.createElement)(_components.__experimentalText, {
+    className: "edit-site-summary-field__label"
+  }, (0, _i18n.__)('Publish')), (0, _element.createElement)(_components.Dropdown, {
+    contentClassName: "edit-site-change-status__content",
+    popoverProps: popoverProps,
+    focusOnMount: true,
+    ref: setPopoverAnchor,
+    renderToggle: ({
+      onToggle
+    }) => (0, _element.createElement)(_components.Button, {
+      className: "edit-site-summary-field__trigger",
+      variant: "tertiary",
+      onClick: onToggle
+    }, relateToNow),
+    renderContent: ({
+      onClose
+    }) => (0, _element.createElement)(_blockEditor.__experimentalPublishDateTimePicker, {
+      currentDate: date,
+      is12Hour: true,
+      onClose: onClose,
+      onChange: saveDate
+    })
+  }));
+}
+//# sourceMappingURL=publish-date.js.map

package/build/components/sidebar-edit-mode/page-panels/publish-date.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/page-panels/publish-date.js"],"names":["ChangeStatus","postType","postId","status","date","editEntityRecord","coreStore","createErrorNotice","noticesStore","popoverAnchor","setPopoverAnchor","popoverProps","anchor","placement","saveDate","newDate","newStatus","Date","error","errorMessage","message","code","type","relateToNow","onToggle","onClose"],"mappings":";;;;;;;AAWA;;AARA;;AAMA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AAfA;AACA;AACA;AAee,SAASA,YAAT,CAAuB;AAAEC,EAAAA,QAAF;AAAYC,EAAAA,MAAZ;AAAoBC,EAAAA,MAApB;AAA4BC,EAAAA;AAA5B,CAAvB,EAA4D;AAC1E,QAAM;AAAEC,IAAAA;AAAF,MAAuB,uBAAaC,eAAb,CAA7B;AACA,QAAM;AAAEC,IAAAA;AAAF,MAAwB,uBAAaC,cAAb,CAA9B;AAEA,QAAM,CAAEC,aAAF,EAAiBC,gBAAjB,IAAsC,uBAAU,IAAV,CAA5C,CAJ0E,CAK1E;;AACA,QAAMC,YAAY,GAAG,sBACpB,OAAQ;AACP;AACA;AACAC,IAAAA,MAAM,EAAEH,aAHD;AAIP,kBAAc,cAAI,qBAAJ,CAJP;AAKPI,IAAAA,SAAS,EAAE;AALJ,GAAR,CADoB,EAQpB,CAAEJ,aAAF,CARoB,CAArB;;AAWA,QAAMK,QAAQ,GAAG,MAAQC,OAAR,IAAqB;AACrC,QAAI;AACH,UAAIC,SAAS,GAAGb,MAAhB;;AACA,UAAKA,MAAM,KAAK,QAAX,IAAuB,IAAIc,IAAJ,CAAUF,OAAV,IAAsB,IAAIE,IAAJ,EAAlD,EAA+D;AAC9DD,QAAAA,SAAS,GAAG,SAAZ;AACA,OAFD,MAEO,IACNb,MAAM,KAAK,SAAX,IACA,IAAIc,IAAJ,CAAUF,OAAV,IAAsB,IAAIE,IAAJ,EAFhB,EAGL;AACDD,QAAAA,SAAS,GAAG,QAAZ;AACA;;AACD,YAAMX,gBAAgB,CAAE,UAAF,EAAcJ,QAAd,EAAwBC,MAAxB,EAAgC;AACrDC,QAAAA,MAAM,EAAEa,SAD6C;AAErDZ,QAAAA,IAAI,EAAEW;AAF+C,OAAhC,CAAtB;AAIA,KAdD,CAcE,OAAQG,KAAR,EAAgB;AACjB,YAAMC,YAAY,GACjBD,KAAK,CAACE,OAAN,IAAiBF,KAAK,CAACG,IAAN,KAAe,eAAhC,GACGH,KAAK,CAACE,OADT,GAEG,cAAI,6CAAJ,CAHJ;AAKAb,MAAAA,iBAAiB,CAAEY,YAAF,EAAgB;AAChCG,QAAAA,IAAI,EAAE;AAD0B,OAAhB,CAAjB;AAGA;AACD,GAzBD;;AA2BA,QAAMC,WAAW,GAAGnB,IAAI,GAAG,yBAAeA,IAAf,CAAH,GAA2B,cAAI,aAAJ,CAAnD;AAEA,SACC,4BAAC,gCAAD;AAAQ,IAAA,SAAS,EAAC;AAAlB,KACC,4BAAC,8BAAD;AAAM,IAAA,SAAS,EAAC;AAAhB,KACG,cAAI,SAAJ,CADH,CADD,EAIC,4BAAC,oBAAD;AACC,IAAA,gBAAgB,EAAC,kCADlB;AAEC,IAAA,YAAY,EAAGO,YAFhB;AAGC,IAAA,YAAY,MAHb;AAIC,IAAA,GAAG,EAAGD,gBAJP;AAKC,IAAA,YAAY,EAAG,CAAE;AAAEc,MAAAA;AAAF,KAAF,KACd,4BAAC,kBAAD;AACC,MAAA,SAAS,EAAC,kCADX;AAEC,MAAA,OAAO,EAAC,UAFT;AAGC,MAAA,OAAO,EAAGA;AAHX,OAKGD,WALH,CANF;AAcC,IAAA,aAAa,EAAG,CAAE;AAAEE,MAAAA;AAAF,KAAF,KACf,4BAAC,gDAAD;AACC,MAAA,WAAW,EAAGrB,IADf;AAEC,MAAA,QAAQ,MAFT;AAGC,MAAA,OAAO,EAAGqB,OAHX;AAIC,MAAA,QAAQ,EAAGX;AAJZ;AAfF,IAJD,CADD;AA8BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tButton,\n\tDropdown,\n\t__experimentalText as Text,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useDispatch } from '@wordpress/data';\nimport { useState, useMemo } from '@wordpress/element';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { __experimentalPublishDateTimePicker as PublishDateTimePicker } from '@wordpress/block-editor';\nimport { humanTimeDiff } from '@wordpress/date';\n\nexport default function ChangeStatus( { postType, postId, status, date } ) {\n\tconst { editEntityRecord } = useDispatch( coreStore );\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState( null );\n\t// Memoize popoverProps to avoid returning a new object every time.\n\tconst popoverProps = useMemo(\n\t\t() => ( {\n\t\t\t// Anchor the popover to the middle of the entire row so that it doesn't\n\t\t\t// move around when the label changes.\n\t\t\tanchor: popoverAnchor,\n\t\t\t'aria-label': __( 'Change publish date' ),\n\t\t\tplacement: 'bottom-end',\n\t\t} ),\n\t\t[ popoverAnchor ]\n\t);\n\n\tconst saveDate = async ( newDate ) => {\n\t\ttry {\n\t\t\tlet newStatus = status;\n\t\t\tif ( status === 'future' && new Date( newDate ) < new Date() ) {\n\t\t\t\tnewStatus = 'publish';\n\t\t\t} else if (\n\t\t\t\tstatus === 'publish' &&\n\t\t\t\tnew Date( newDate ) > new Date()\n\t\t\t) {\n\t\t\t\tnewStatus = 'future';\n\t\t\t}\n\t\t\tawait editEntityRecord( 'postType', postType, postId, {\n\t\t\t\tstatus: newStatus,\n\t\t\t\tdate: newDate,\n\t\t\t} );\n\t\t} catch ( error ) {\n\t\t\tconst errorMessage =\n\t\t\t\terror.message && error.code !== 'unknown_error'\n\t\t\t\t\t? error.message\n\t\t\t\t\t: __( 'An error occurred while updating the status' );\n\n\t\t\tcreateErrorNotice( errorMessage, {\n\t\t\t\ttype: 'snackbar',\n\t\t\t} );\n\t\t}\n\t};\n\n\tconst relateToNow = date ? humanTimeDiff( date ) : __( 'Immediately' );\n\n\treturn (\n\t\t<HStack className=\"edit-site-summary-field\">\n\t\t\t<Text className=\"edit-site-summary-field__label\">\n\t\t\t\t{ __( 'Publish' ) }\n\t\t\t</Text>\n\t\t\t<Dropdown\n\t\t\t\tcontentClassName=\"edit-site-change-status__content\"\n\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\tfocusOnMount\n\t\t\t\tref={ setPopoverAnchor }\n\t\t\t\trenderToggle={ ( { onToggle } ) => (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName=\"edit-site-summary-field__trigger\"\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ relateToNow }\n\t\t\t\t\t</Button>\n\t\t\t\t) }\n\t\t\t\trenderContent={ ( { onClose } ) => (\n\t\t\t\t\t<PublishDateTimePicker\n\t\t\t\t\t\tcurrentDate={ date }\n\t\t\t\t\t\tis12Hour\n\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\tonChange={ saveDate }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t/>\n\t\t</HStack>\n\t);\n}\n"]}

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

@@ -1,7 +1,5 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,8 +7,6 @@ exports.default = PluginSidebarEditSite;
 
 var _element = require("@wordpress/element");
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _interface = require("@wordpress/interface");
 
 var _data = require("@wordpress/data");
@@ -90,17 +86,17 @@ var _store = require("../../../store");
  * );
  * ```
  */
-function PluginSidebarEditSite(_ref) {
-  let {
-    className,
-    ...props
-  } = _ref;
+function PluginSidebarEditSite({
+  className,
+  ...props
+}) {
   const showIconLabels = (0, _data.useSelect)(select => select(_store.store).getSettings().showIconLabels, []);
-  return (0, _element.createElement)(_interface.ComplementaryArea, (0, _extends2.default)({
+  return (0, _element.createElement)(_interface.ComplementaryArea, {
     panelClassName: className,
     className: "edit-site-sidebar-edit-mode",
     scope: "core/edit-site",
-    showIconLabels: showIconLabels
-  }, props));
+    showIconLabels: showIconLabels,
+    ...props
+  });
 }
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/plugin-sidebar/index.js"],"names":["PluginSidebarEditSite","className","props","showIconLabels","select","editSiteStore","getSettings"],"mappings":";;;;;;;;;;;;;AAGA;;AACA;;AAKA;;AATA;AACA;AACA;;AAIA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACe,SAASA,qBAAT,OAA0D;AAAA,MAA1B;AAAEC,IAAAA,SAAF;AAAa,OAAGC;AAAhB,GAA0B;AACxE,QAAMC,cAAc,GAAG,qBACpBC,MAAF,IAAcA,MAAM,CAAEC,YAAF,CAAN,CAAwBC,WAAxB,GAAsCH,cAD9B,EAEtB,EAFsB,CAAvB;AAKA,SACC,4BAAC,4BAAD;AACC,IAAA,cAAc,EAAGF,SADlB;AAEC,IAAA,SAAS,EAAC,6BAFX;AAGC,IAAA,KAAK,EAAC,gBAHP;AAIC,IAAA,cAAc,EAAGE;AAJlB,KAKMD,KALN,EADD;AASA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { ComplementaryArea } from '@wordpress/interface';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../../store';\n\n/**\n * Renders a sidebar when activated. The contents within the `PluginSidebar` will appear as content within the sidebar.\n * It also automatically renders a corresponding `PluginSidebarMenuItem` component when `isPinnable` flag is set to `true`.\n * If you wish to display the sidebar, you can with use the `PluginSidebarMoreMenuItem` component or the `wp.data.dispatch` API:\n *\n * ```js\n * wp.data.dispatch( 'core/edit-site' ).openGeneralSidebar( 'plugin-name/sidebar-name' );\n * ```\n *\n * @see PluginSidebarMoreMenuItem\n *\n * @param {Object}                props                                 Element props.\n * @param {string}                props.name                            A string identifying the sidebar. Must be unique for every sidebar registered within the scope of your plugin.\n * @param {string}                [props.className]                     An optional class name added to the sidebar body.\n * @param {string}                props.title                           Title displayed at the top of the sidebar.\n * @param {boolean}               [props.isPinnable=true]               Whether to allow to pin sidebar to the toolbar. When set to `true` it also automatically renders a corresponding menu item.\n * @param {WPBlockTypeIconRender} [props.icon=inherits from the plugin] The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered when the sidebar is pinned to toolbar.\n *\n * @example\n * ```js\n * // Using ES5 syntax\n * var __ = wp.i18n.__;\n * var el = wp.element.createElement;\n * var PanelBody = wp.components.PanelBody;\n * var PluginSidebar = wp.editSite.PluginSidebar;\n * var moreIcon = wp.element.createElement( 'svg' ); //... svg element.\n *\n * function MyPluginSidebar() {\n * \treturn el(\n * \t\t\tPluginSidebar,\n * \t\t\t{\n * \t\t\t\tname: 'my-sidebar',\n * \t\t\t\ttitle: 'My sidebar title',\n * \t\t\t\ticon: moreIcon,\n * \t\t\t},\n * \t\t\tel(\n * \t\t\t\tPanelBody,\n * \t\t\t\t{},\n * \t\t\t\t__( 'My sidebar content' )\n * \t\t\t)\n * \t);\n * }\n * ```\n *\n * @example\n * ```jsx\n * // Using ESNext syntax\n * import { __ } from '@wordpress/i18n';\n * import { PanelBody } from '@wordpress/components';\n * import { PluginSidebar } from '@wordpress/edit-site';\n * import { more } from '@wordpress/icons';\n *\n * const MyPluginSidebar = () => (\n * \t<PluginSidebar\n * \t\tname=\"my-sidebar\"\n * \t\ttitle=\"My sidebar title\"\n * \t\ticon={ more }\n * \t>\n * \t\t<PanelBody>\n * \t\t\t{ __( 'My sidebar content' ) }\n * \t\t</PanelBody>\n * \t</PluginSidebar>\n * );\n * ```\n */\nexport default function PluginSidebarEditSite( { className, ...props } ) {\n\tconst showIconLabels = useSelect(\n\t\t( select ) => select( editSiteStore ).getSettings().showIconLabels,\n\t\t[]\n\t);\n\n\treturn (\n\t\t<ComplementaryArea\n\t\t\tpanelClassName={ className }\n\t\t\tclassName=\"edit-site-sidebar-edit-mode\"\n\t\t\tscope=\"core/edit-site\"\n\t\t\tshowIconLabels={ showIconLabels }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/plugin-sidebar/index.js"],"names":["PluginSidebarEditSite","className","props","showIconLabels","select","editSiteStore","getSettings"],"mappings":";;;;;;;;;AAGA;;AACA;;AAKA;;AATA;AACA;AACA;;AAIA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACe,SAASA,qBAAT,CAAgC;AAAEC,EAAAA,SAAF;AAAa,KAAGC;AAAhB,CAAhC,EAA0D;AACxE,QAAMC,cAAc,GAAG,qBACpBC,MAAF,IAAcA,MAAM,CAAEC,YAAF,CAAN,CAAwBC,WAAxB,GAAsCH,cAD9B,EAEtB,EAFsB,CAAvB;AAKA,SACC,4BAAC,4BAAD;AACC,IAAA,cAAc,EAAGF,SADlB;AAEC,IAAA,SAAS,EAAC,6BAFX;AAGC,IAAA,KAAK,EAAC,gBAHP;AAIC,IAAA,cAAc,EAAGE,cAJlB;AAAA,OAKMD;AALN,IADD;AASA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { ComplementaryArea } from '@wordpress/interface';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../../store';\n\n/**\n * Renders a sidebar when activated. The contents within the `PluginSidebar` will appear as content within the sidebar.\n * It also automatically renders a corresponding `PluginSidebarMenuItem` component when `isPinnable` flag is set to `true`.\n * If you wish to display the sidebar, you can with use the `PluginSidebarMoreMenuItem` component or the `wp.data.dispatch` API:\n *\n * ```js\n * wp.data.dispatch( 'core/edit-site' ).openGeneralSidebar( 'plugin-name/sidebar-name' );\n * ```\n *\n * @see PluginSidebarMoreMenuItem\n *\n * @param {Object}                props                                 Element props.\n * @param {string}                props.name                            A string identifying the sidebar. Must be unique for every sidebar registered within the scope of your plugin.\n * @param {string}                [props.className]                     An optional class name added to the sidebar body.\n * @param {string}                props.title                           Title displayed at the top of the sidebar.\n * @param {boolean}               [props.isPinnable=true]               Whether to allow to pin sidebar to the toolbar. When set to `true` it also automatically renders a corresponding menu item.\n * @param {WPBlockTypeIconRender} [props.icon=inherits from the plugin] The [Dashicon](https://developer.wordpress.org/resource/dashicons/) icon slug string, or an SVG WP element, to be rendered when the sidebar is pinned to toolbar.\n *\n * @example\n * ```js\n * // Using ES5 syntax\n * var __ = wp.i18n.__;\n * var el = wp.element.createElement;\n * var PanelBody = wp.components.PanelBody;\n * var PluginSidebar = wp.editSite.PluginSidebar;\n * var moreIcon = wp.element.createElement( 'svg' ); //... svg element.\n *\n * function MyPluginSidebar() {\n * \treturn el(\n * \t\t\tPluginSidebar,\n * \t\t\t{\n * \t\t\t\tname: 'my-sidebar',\n * \t\t\t\ttitle: 'My sidebar title',\n * \t\t\t\ticon: moreIcon,\n * \t\t\t},\n * \t\t\tel(\n * \t\t\t\tPanelBody,\n * \t\t\t\t{},\n * \t\t\t\t__( 'My sidebar content' )\n * \t\t\t)\n * \t);\n * }\n * ```\n *\n * @example\n * ```jsx\n * // Using ESNext syntax\n * import { __ } from '@wordpress/i18n';\n * import { PanelBody } from '@wordpress/components';\n * import { PluginSidebar } from '@wordpress/edit-site';\n * import { more } from '@wordpress/icons';\n *\n * const MyPluginSidebar = () => (\n * \t<PluginSidebar\n * \t\tname=\"my-sidebar\"\n * \t\ttitle=\"My sidebar title\"\n * \t\ticon={ more }\n * \t>\n * \t\t<PanelBody>\n * \t\t\t{ __( 'My sidebar content' ) }\n * \t\t</PanelBody>\n * \t</PluginSidebar>\n * );\n * ```\n */\nexport default function PluginSidebarEditSite( { className, ...props } ) {\n\tconst showIconLabels = useSelect(\n\t\t( select ) => select( editSiteStore ).getSettings().showIconLabels,\n\t\t[]\n\t);\n\n\treturn (\n\t\t<ComplementaryArea\n\t\t\tpanelClassName={ className }\n\t\t\tclassName=\"edit-site-sidebar-edit-mode\"\n\t\t\tscope=\"core/edit-site\"\n\t\t\tshowIconLabels={ showIconLabels }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n"]}

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

@@ -1,5 +1,7 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -7,6 +9,8 @@ exports.default = void 0;
 
 var _element = require("@wordpress/element");
 
+var _classnames = _interopRequireDefault(require("classnames"));
+
 var _components = require("@wordpress/components");
 
 var _i18n = require("@wordpress/i18n");
@@ -19,6 +23,12 @@ var _constants = require("../../../store/constants");
 
 var _constants2 = require("../constants");
 
+var _store = require("../../../store");
+
+/**
+ * External dependencies
+ */
+
 /**
  * WordPress dependencies
  */
@@ -26,10 +36,23 @@ var _constants2 = require("../constants");
 /**
  * Internal dependencies
  */
-const SettingsHeader = _ref => {
-  let {
-    sidebarName
-  } = _ref;
+const SettingsHeader = ({
+  sidebarName
+}) => {
+  const {
+    hasPageContentFocus,
+    entityType
+  } = (0, _data.useSelect)(select => {
+    const {
+      getEditedPostType,
+      hasPageContentFocus: _hasPageContentFocus
+    } = select(_store.store);
+    return {
+      hasPageContentFocus: _hasPageContentFocus(),
+      entityType: getEditedPostType()
+    };
+  });
+  const entityLabel = entityType === 'wp_navigation' ? (0, _i18n.__)('Navigation') : (0, _i18n.__)('Template');
   const {
     enableComplementaryArea
   } = (0, _data.useDispatch)(_interface.store);
@@ -38,29 +61,37 @@ const SettingsHeader = _ref => {
 
   const openBlockSettings = () => enableComplementaryArea(_constants.STORE_NAME, _constants2.SIDEBAR_BLOCK);
 
-  const [templateAriaLabel, templateActiveClass] = sidebarName === _constants2.SIDEBAR_TEMPLATE ? // translators: ARIA label for the Template sidebar tab, selected.
-  [(0, _i18n.__)('Template (selected)'), 'is-active'] : // translators: ARIA label for the Template Settings Sidebar tab, not selected.
-  [(0, _i18n.__)('Template'), ''];
-  const [blockAriaLabel, blockActiveClass] = sidebarName === _constants2.SIDEBAR_BLOCK ? // translators: ARIA label for the Block Settings Sidebar tab, selected.
-  [(0, _i18n.__)('Block (selected)'), 'is-active'] : // translators: ARIA label for the Block Settings Sidebar tab, not selected.
-  [(0, _i18n.__)('Block'), ''];
+  let templateAriaLabel;
+
+  if (hasPageContentFocus) {
+    templateAriaLabel = sidebarName === _constants2.SIDEBAR_TEMPLATE ? // translators: ARIA label for the Template sidebar tab, selected.
+    (0, _i18n.__)('Page (selected)') : // translators: ARIA label for the Template Settings Sidebar tab, not selected.
+    (0, _i18n.__)('Page');
+  } else {
+    templateAriaLabel = sidebarName === _constants2.SIDEBAR_TEMPLATE ? // translators: ARIA label for the Template sidebar tab, selected.
+    (0, _i18n.sprintf)((0, _i18n.__)('%s (selected)'), entityLabel) : // translators: ARIA label for the Template Settings Sidebar tab, not selected.
+    entityLabel;
+  }
   /* Use a list so screen readers will announce how many tabs there are. */
 
+
   return (0, _element.createElement)("ul", null, (0, _element.createElement)("li", null, (0, _element.createElement)(_components.Button, {
     onClick: openTemplateSettings,
-    className: `edit-site-sidebar-edit-mode__panel-tab ${templateActiveClass}`,
-    "aria-label": templateAriaLabel // translators: Data label for the Template Settings Sidebar tab.
-    ,
-    "data-label": (0, _i18n.__)('Template')
-  }, // translators: Text label for the Template Settings Sidebar tab.
-  (0, _i18n.__)('Template'))), (0, _element.createElement)("li", null, (0, _element.createElement)(_components.Button, {
+    className: (0, _classnames.default)('edit-site-sidebar-edit-mode__panel-tab', {
+      'is-active': sidebarName === _constants2.SIDEBAR_TEMPLATE
+    }),
+    "aria-label": templateAriaLabel,
+    "data-label": hasPageContentFocus ? (0, _i18n.__)('Page') : entityLabel
+  }, hasPageContentFocus ? (0, _i18n.__)('Page') : entityLabel)), (0, _element.createElement)("li", null, (0, _element.createElement)(_components.Button, {
     onClick: openBlockSettings,
-    className: `edit-site-sidebar-edit-mode__panel-tab ${blockActiveClass}`,
-    "aria-label": blockAriaLabel // translators: Data label for the Block Settings Sidebar tab.
-    ,
+    className: (0, _classnames.default)('edit-site-sidebar-edit-mode__panel-tab', {
+      'is-active': sidebarName === _constants2.SIDEBAR_BLOCK
+    }),
+    "aria-label": sidebarName === _constants2.SIDEBAR_BLOCK ? // translators: ARIA label for the Block Settings Sidebar tab, selected.
+    (0, _i18n.__)('Block (selected)') : // translators: ARIA label for the Block Settings Sidebar tab, not selected.
+    (0, _i18n.__)('Block'),
     "data-label": (0, _i18n.__)('Block')
-  }, // translators: Text label for the Block Settings Sidebar tab.
-  (0, _i18n.__)('Block'))));
+  }, (0, _i18n.__)('Block'))));
 };
 
 var _default = SettingsHeader;

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

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/settings-header/index.js"],"names":["SettingsHeader","sidebarName","enableComplementaryArea","interfaceStore","openTemplateSettings","STORE_NAME","SIDEBAR_TEMPLATE","openBlockSettings","SIDEBAR_BLOCK","templateAriaLabel","templateActiveClass","blockAriaLabel","blockActiveClass"],"mappings":";;;;;;;;;AAGA;;AACA;;AACA;;AACA;;AAKA;;AACA;;AAZA;AACA;AACA;;AAMA;AACA;AACA;AAIA,MAAMA,cAAc,GAAG,QAAuB;AAAA,MAArB;AAAEC,IAAAA;AAAF,GAAqB;AAC7C,QAAM;AAAEC,IAAAA;AAAF,MAA8B,uBAAaC,gBAAb,CAApC;;AACA,QAAMC,oBAAoB,GAAG,MAC5BF,uBAAuB,CAAEG,qBAAF,EAAcC,4BAAd,CADxB;;AAEA,QAAMC,iBAAiB,GAAG,MACzBL,uBAAuB,CAAEG,qBAAF,EAAcG,yBAAd,CADxB;;AAGA,QAAM,CAAEC,iBAAF,EAAqBC,mBAArB,IACLT,WAAW,KAAKK,4BAAhB,GACG;AACA,GAAE,cAAI,qBAAJ,CAAF,EAA+B,WAA/B,CAFH,GAGG;AACA,GAAE,cAAI,UAAJ,CAAF,EAAoB,EAApB,CALJ;AAOA,QAAM,CAAEK,cAAF,EAAkBC,gBAAlB,IACLX,WAAW,KAAKO,yBAAhB,GACG;AACA,GAAE,cAAI,kBAAJ,CAAF,EAA4B,WAA5B,CAFH,GAGG;AACA,GAAE,cAAI,OAAJ,CAAF,EAAiB,EAAjB,CALJ;AAOA;;AACA,SACC,wCACC,wCACC,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAGJ,oBADX;AAEC,IAAA,SAAS,EAAI,0CAA0CM,mBAAqB,EAF7E;AAGC,kBAAaD,iBAHd,CAIC;AAJD;AAKC,kBAAa,cAAI,UAAJ;AALd,KAQE;AACA,gBAAI,UAAJ,CATF,CADD,CADD,EAeC,wCACC,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAGF,iBADX;AAEC,IAAA,SAAS,EAAI,0CAA0CK,gBAAkB,EAF1E;AAGC,kBAAaD,cAHd,CAIC;AAJD;AAKC,kBAAa,cAAI,OAAJ;AALd,KAQE;AACA,gBAAI,OAAJ,CATF,CADD,CAfD,CADD;AAgCA,CAtDD;;eAwDeX,c","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { Button } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useDispatch } from '@wordpress/data';\nimport { store as interfaceStore } from '@wordpress/interface';\n\n/**\n * Internal dependencies\n */\nimport { STORE_NAME } from '../../../store/constants';\nimport { SIDEBAR_BLOCK, SIDEBAR_TEMPLATE } from '../constants';\n\nconst SettingsHeader = ( { sidebarName } ) => {\n\tconst { enableComplementaryArea } = useDispatch( interfaceStore );\n\tconst openTemplateSettings = () =>\n\t\tenableComplementaryArea( STORE_NAME, SIDEBAR_TEMPLATE );\n\tconst openBlockSettings = () =>\n\t\tenableComplementaryArea( STORE_NAME, SIDEBAR_BLOCK );\n\n\tconst [ templateAriaLabel, templateActiveClass ] =\n\t\tsidebarName === SIDEBAR_TEMPLATE\n\t\t\t? // translators: ARIA label for the Template sidebar tab, selected.\n\t\t\t  [ __( 'Template (selected)' ), 'is-active' ]\n\t\t\t: // translators: ARIA label for the Template Settings Sidebar tab, not selected.\n\t\t\t  [ __( 'Template' ), '' ];\n\n\tconst [ blockAriaLabel, blockActiveClass ] =\n\t\tsidebarName === SIDEBAR_BLOCK\n\t\t\t? // translators: ARIA label for the Block Settings Sidebar tab, selected.\n\t\t\t  [ __( 'Block (selected)' ), 'is-active' ]\n\t\t\t: // translators: ARIA label for the Block Settings Sidebar tab, not selected.\n\t\t\t  [ __( 'Block' ), '' ];\n\n\t/* Use a list so screen readers will announce how many tabs there are. */\n\treturn (\n\t\t<ul>\n\t\t\t<li>\n\t\t\t\t<Button\n\t\t\t\t\tonClick={ openTemplateSettings }\n\t\t\t\t\tclassName={ `edit-site-sidebar-edit-mode__panel-tab ${ templateActiveClass }` }\n\t\t\t\t\taria-label={ templateAriaLabel }\n\t\t\t\t\t// translators: Data label for the Template Settings Sidebar tab.\n\t\t\t\t\tdata-label={ __( 'Template' ) }\n\t\t\t\t>\n\t\t\t\t\t{\n\t\t\t\t\t\t// translators: Text label for the Template Settings Sidebar tab.\n\t\t\t\t\t\t__( 'Template' )\n\t\t\t\t\t}\n\t\t\t\t</Button>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<Button\n\t\t\t\t\tonClick={ openBlockSettings }\n\t\t\t\t\tclassName={ `edit-site-sidebar-edit-mode__panel-tab ${ blockActiveClass }` }\n\t\t\t\t\taria-label={ blockAriaLabel }\n\t\t\t\t\t// translators: Data label for the Block Settings Sidebar tab.\n\t\t\t\t\tdata-label={ __( 'Block' ) }\n\t\t\t\t>\n\t\t\t\t\t{\n\t\t\t\t\t\t// translators: Text label for the Block Settings Sidebar tab.\n\t\t\t\t\t\t__( 'Block' )\n\t\t\t\t\t}\n\t\t\t\t</Button>\n\t\t\t</li>\n\t\t</ul>\n\t);\n};\n\nexport default SettingsHeader;\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/settings-header/index.js"],"names":["SettingsHeader","sidebarName","hasPageContentFocus","entityType","select","getEditedPostType","_hasPageContentFocus","editSiteStore","entityLabel","enableComplementaryArea","interfaceStore","openTemplateSettings","STORE_NAME","SIDEBAR_TEMPLATE","openBlockSettings","SIDEBAR_BLOCK","templateAriaLabel"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AACA;;AACA;;AACA;;AAKA;;AACA;;AACA;;AAlBA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;AAKA,MAAMA,cAAc,GAAG,CAAE;AAAEC,EAAAA;AAAF,CAAF,KAAuB;AAC7C,QAAM;AAAEC,IAAAA,mBAAF;AAAuBC,IAAAA;AAAvB,MAAsC,qBAAaC,MAAF,IAAc;AACpE,UAAM;AAAEC,MAAAA,iBAAF;AAAqBH,MAAAA,mBAAmB,EAAEI;AAA1C,QACLF,MAAM,CAAEG,YAAF,CADP;AAGA,WAAO;AACNL,MAAAA,mBAAmB,EAAEI,oBAAoB,EADnC;AAENH,MAAAA,UAAU,EAAEE,iBAAiB;AAFvB,KAAP;AAIA,GAR2C,CAA5C;AAUA,QAAMG,WAAW,GAChBL,UAAU,KAAK,eAAf,GAAiC,cAAI,YAAJ,CAAjC,GAAsD,cAAI,UAAJ,CADvD;AAGA,QAAM;AAAEM,IAAAA;AAAF,MAA8B,uBAAaC,gBAAb,CAApC;;AACA,QAAMC,oBAAoB,GAAG,MAC5BF,uBAAuB,CAAEG,qBAAF,EAAcC,4BAAd,CADxB;;AAEA,QAAMC,iBAAiB,GAAG,MACzBL,uBAAuB,CAAEG,qBAAF,EAAcG,yBAAd,CADxB;;AAGA,MAAIC,iBAAJ;;AACA,MAAKd,mBAAL,EAA2B;AAC1Bc,IAAAA,iBAAiB,GAChBf,WAAW,KAAKY,4BAAhB,GACG;AACA,kBAAI,iBAAJ,CAFH,GAGG;AACA,kBAAI,MAAJ,CALJ;AAMA,GAPD,MAOO;AACNG,IAAAA,iBAAiB,GAChBf,WAAW,KAAKY,4BAAhB,GACG;AACA,uBAAS,cAAI,eAAJ,CAAT,EAAgCL,WAAhC,CAFH,GAGG;AACAA,IAAAA,WALJ;AAMA;AAED;;;AACA,SACC,wCACC,wCACC,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAGG,oBADX;AAEC,IAAA,SAAS,EAAG,yBACX,wCADW,EAEX;AACC,mBAAaV,WAAW,KAAKY;AAD9B,KAFW,CAFb;AAQC,kBAAaG,iBARd;AASC,kBACCd,mBAAmB,GAAG,cAAI,MAAJ,CAAH,GAAkBM;AAVvC,KAaGN,mBAAmB,GAAG,cAAI,MAAJ,CAAH,GAAkBM,WAbxC,CADD,CADD,EAkBC,wCACC,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAGM,iBADX;AAEC,IAAA,SAAS,EAAG,yBACX,wCADW,EAEX;AACC,mBAAab,WAAW,KAAKc;AAD9B,KAFW,CAFb;AAQC,kBACCd,WAAW,KAAKc,yBAAhB,GACG;AACA,kBAAI,kBAAJ,CAFH,GAGG;AACA,kBAAI,OAAJ,CAbL;AAeC,kBAAa,cAAI,OAAJ;AAfd,KAiBG,cAAI,OAAJ,CAjBH,CADD,CAlBD,CADD;AA0CA,CAhFD;;eAkFef,c","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Button } from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { store as interfaceStore } from '@wordpress/interface';\n\n/**\n * Internal dependencies\n */\nimport { STORE_NAME } from '../../../store/constants';\nimport { SIDEBAR_BLOCK, SIDEBAR_TEMPLATE } from '../constants';\nimport { store as editSiteStore } from '../../../store';\n\nconst SettingsHeader = ( { sidebarName } ) => {\n\tconst { hasPageContentFocus, entityType } = useSelect( ( select ) => {\n\t\tconst { getEditedPostType, hasPageContentFocus: _hasPageContentFocus } =\n\t\t\tselect( editSiteStore );\n\n\t\treturn {\n\t\t\thasPageContentFocus: _hasPageContentFocus(),\n\t\t\tentityType: getEditedPostType(),\n\t\t};\n\t} );\n\n\tconst entityLabel =\n\t\tentityType === 'wp_navigation' ? __( 'Navigation' ) : __( 'Template' );\n\n\tconst { enableComplementaryArea } = useDispatch( interfaceStore );\n\tconst openTemplateSettings = () =>\n\t\tenableComplementaryArea( STORE_NAME, SIDEBAR_TEMPLATE );\n\tconst openBlockSettings = () =>\n\t\tenableComplementaryArea( STORE_NAME, SIDEBAR_BLOCK );\n\n\tlet templateAriaLabel;\n\tif ( hasPageContentFocus ) {\n\t\ttemplateAriaLabel =\n\t\t\tsidebarName === SIDEBAR_TEMPLATE\n\t\t\t\t? // translators: ARIA label for the Template sidebar tab, selected.\n\t\t\t\t  __( 'Page (selected)' )\n\t\t\t\t: // translators: ARIA label for the Template Settings Sidebar tab, not selected.\n\t\t\t\t  __( 'Page' );\n\t} else {\n\t\ttemplateAriaLabel =\n\t\t\tsidebarName === SIDEBAR_TEMPLATE\n\t\t\t\t? // translators: ARIA label for the Template sidebar tab, selected.\n\t\t\t\t  sprintf( __( '%s (selected)' ), entityLabel )\n\t\t\t\t: // translators: ARIA label for the Template Settings Sidebar tab, not selected.\n\t\t\t\t  entityLabel;\n\t}\n\n\t/* Use a list so screen readers will announce how many tabs there are. */\n\treturn (\n\t\t<ul>\n\t\t\t<li>\n\t\t\t\t<Button\n\t\t\t\t\tonClick={ openTemplateSettings }\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'edit-site-sidebar-edit-mode__panel-tab',\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-active': sidebarName === SIDEBAR_TEMPLATE,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\taria-label={ templateAriaLabel }\n\t\t\t\t\tdata-label={\n\t\t\t\t\t\thasPageContentFocus ? __( 'Page' ) : entityLabel\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t{ hasPageContentFocus ? __( 'Page' ) : entityLabel }\n\t\t\t\t</Button>\n\t\t\t</li>\n\t\t\t<li>\n\t\t\t\t<Button\n\t\t\t\t\tonClick={ openBlockSettings }\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'edit-site-sidebar-edit-mode__panel-tab',\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-active': sidebarName === SIDEBAR_BLOCK,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\taria-label={\n\t\t\t\t\t\tsidebarName === SIDEBAR_BLOCK\n\t\t\t\t\t\t\t? // translators: ARIA label for the Block Settings Sidebar tab, selected.\n\t\t\t\t\t\t\t  __( 'Block (selected)' )\n\t\t\t\t\t\t\t: // translators: ARIA label for the Block Settings Sidebar tab, not selected.\n\t\t\t\t\t\t\t  __( 'Block' )\n\t\t\t\t\t}\n\t\t\t\t\tdata-label={ __( 'Block' ) }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Block' ) }\n\t\t\t\t</Button>\n\t\t\t</li>\n\t\t</ul>\n\t);\n};\n\nexport default SettingsHeader;\n"]}

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

@@ -0,0 +1,46 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = SidebarCard;
+
+var _element = require("@wordpress/element");
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _components = require("@wordpress/components");
+
+/**
+ * External dependencies
+ */
+
+/**
+ * WordPress dependencies
+ */
+function SidebarCard({
+  className,
+  title,
+  icon,
+  description,
+  actions,
+  children
+}) {
+  return (0, _element.createElement)("div", {
+    className: (0, _classnames.default)('edit-site-sidebar-card', className)
+  }, (0, _element.createElement)(_components.Icon, {
+    className: "edit-site-sidebar-card__icon",
+    icon: icon
+  }), (0, _element.createElement)("div", {
+    className: "edit-site-sidebar-card__content"
+  }, (0, _element.createElement)("div", {
+    className: "edit-site-sidebar-card__header"
+  }, (0, _element.createElement)("h2", {
+    className: "edit-site-sidebar-card__title"
+  }, title), actions), (0, _element.createElement)("div", {
+    className: "edit-site-sidebar-card__description"
+  }, description), children));
+}
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-edit-mode/sidebar-card/index.js"],"names":["SidebarCard","className","title","icon","description","actions","children"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AARA;AACA;AACA;;AAGA;AACA;AACA;AAGe,SAASA,WAAT,CAAsB;AACpCC,EAAAA,SADoC;AAEpCC,EAAAA,KAFoC;AAGpCC,EAAAA,IAHoC;AAIpCC,EAAAA,WAJoC;AAKpCC,EAAAA,OALoC;AAMpCC,EAAAA;AANoC,CAAtB,EAOX;AACH,SACC;AAAK,IAAA,SAAS,EAAG,yBAAY,wBAAZ,EAAsCL,SAAtC;AAAjB,KACC,4BAAC,gBAAD;AAAM,IAAA,SAAS,EAAC,8BAAhB;AAA+C,IAAA,IAAI,EAAGE;AAAtD,IADD,EAEC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC;AAAI,IAAA,SAAS,EAAC;AAAd,KAAgDD,KAAhD,CADD,EAEGG,OAFH,CADD,EAKC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGD,WADH,CALD,EAQGE,QARH,CAFD,CADD;AAeA","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Icon } from '@wordpress/components';\n\nexport default function SidebarCard( {\n\tclassName,\n\ttitle,\n\ticon,\n\tdescription,\n\tactions,\n\tchildren,\n} ) {\n\treturn (\n\t\t<div className={ classnames( 'edit-site-sidebar-card', className ) }>\n\t\t\t<Icon className=\"edit-site-sidebar-card__icon\" icon={ icon } />\n\t\t\t<div className=\"edit-site-sidebar-card__content\">\n\t\t\t\t<div className=\"edit-site-sidebar-card__header\">\n\t\t\t\t\t<h2 className=\"edit-site-sidebar-card__title\">{ title }</h2>\n\t\t\t\t\t{ actions }\n\t\t\t\t</div>\n\t\t\t\t<div className=\"edit-site-sidebar-card__description\">\n\t\t\t\t\t{ description }\n\t\t\t\t</div>\n\t\t\t\t{ children }\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"]}