@wordpress/edit-site 5.12.0 → 5.12.1

package/build/components/page-content-focus-manager/back-to-page-notification.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-content-focus-manager/back-to-page-notification.js"],"names":["BackToPageNotification","useBackToPageNotification","hasPageContentFocus","select","editSiteStore","alreadySeen","prevHasPageContentFocus","createInfoNotice","noticesStore","setHasPageContentFocus","current","isDismissible","type","actions","label","onClick"],"mappings":";;;;;;;;AAGA;;AACA;;AACA;;AACA;;AAKA;;AAXA;AACA;AACA;;AAMA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACe,SAASA,sBAAT,GAAkC;AAChDC,EAAAA,yBAAyB;AACzB,SAAO,IAAP;AACA;AAED;AACA;AACA;AACA;;;AACO,SAASA,yBAAT,GAAqC;AAC3C,QAAMC,mBAAmB,GAAG,qBACzBC,MAAF,IAAcA,MAAM,CAAEC,YAAF,CAAN,CAAwBF,mBAAxB,EADa,EAE3B,EAF2B,CAA5B;AAKA,QAAMG,WAAW,GAAG,qBAAQ,KAAR,CAApB;AACA,QAAMC,uBAAuB,GAAG,qBAAQ,KAAR,CAAhC;AAEA,QAAM;AAAEC,IAAAA;AAAF,MAAuB,uBAAaC,cAAb,CAA7B;AACA,QAAM;AAAEC,IAAAA;AAAF,MAA6B,uBAAaL,YAAb,CAAnC;AAEA,0BAAW,MAAM;AAChB,QACC,CAAEC,WAAW,CAACK,OAAd,IACAJ,uBAAuB,CAACI,OADxB,IAEA,CAAER,mBAHH,EAIE;AACDK,MAAAA,gBAAgB,CAAE,cAAI,6BAAJ,CAAF,EAAuC;AACtDI,QAAAA,aAAa,EAAE,IADuC;AAEtDC,QAAAA,IAAI,EAAE,UAFgD;AAGtDC,QAAAA,OAAO,EAAE,CACR;AACCC,UAAAA,KAAK,EAAE,cAAI,cAAJ,CADR;AAECC,UAAAA,OAAO,EAAE,MAAMN,sBAAsB,CAAE,IAAF;AAFtC,SADQ;AAH6C,OAAvC,CAAhB;AAUAJ,MAAAA,WAAW,CAACK,OAAZ,GAAsB,IAAtB;AACA;;AACDJ,IAAAA,uBAAuB,CAACI,OAAxB,GAAkCR,mBAAlC;AACA,GAnBD,EAmBG,CACFG,WADE,EAEFC,uBAFE,EAGFJ,mBAHE,EAIFK,gBAJE,EAKFE,sBALE,CAnBH;AA0BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect, useRef } from '@wordpress/element';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\n\n/**\n * Component that displays a 'You are editing a template' notification when the\n * user switches from focusing on editing page content to editing a template.\n */\nexport default function BackToPageNotification() {\n\tuseBackToPageNotification();\n\treturn null;\n}\n\n/**\n * Hook that displays a 'You are editing a template' notification when the user\n * switches from focusing on editing page content to editing a template.\n */\nexport function useBackToPageNotification() {\n\tconst hasPageContentFocus = useSelect(\n\t\t( select ) => select( editSiteStore ).hasPageContentFocus(),\n\t\t[]\n\t);\n\n\tconst alreadySeen = useRef( false );\n\tconst prevHasPageContentFocus = useRef( false );\n\n\tconst { createInfoNotice } = useDispatch( noticesStore );\n\tconst { setHasPageContentFocus } = useDispatch( editSiteStore );\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\t! alreadySeen.current &&\n\t\t\tprevHasPageContentFocus.current &&\n\t\t\t! hasPageContentFocus\n\t\t) {\n\t\t\tcreateInfoNotice( __( 'You are editing a template.' ), {\n\t\t\t\tisDismissible: true,\n\t\t\t\ttype: 'snackbar',\n\t\t\t\tactions: [\n\t\t\t\t\t{\n\t\t\t\t\t\tlabel: __( 'Back to page' ),\n\t\t\t\t\t\tonClick: () => setHasPageContentFocus( true ),\n\t\t\t\t\t},\n\t\t\t\t],\n\t\t\t} );\n\t\t\talreadySeen.current = true;\n\t\t}\n\t\tprevHasPageContentFocus.current = hasPageContentFocus;\n\t}, [\n\t\talreadySeen,\n\t\tprevHasPageContentFocus,\n\t\thasPageContentFocus,\n\t\tcreateInfoNotice,\n\t\tsetHasPageContentFocus,\n\t] );\n}\n"]}

package/build/components/page-content-focus-manager/constants.js

@@ -0,0 +1,9 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PAGE_CONTENT_BLOCK_TYPES = void 0;
+const PAGE_CONTENT_BLOCK_TYPES = ['core/post-title', 'core/post-featured-image', 'core/post-content'];
+exports.PAGE_CONTENT_BLOCK_TYPES = PAGE_CONTENT_BLOCK_TYPES;
+//# sourceMappingURL=constants.js.map

package/build/components/page-content-focus-manager/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-content-focus-manager/constants.js"],"names":["PAGE_CONTENT_BLOCK_TYPES"],"mappings":";;;;;;AAAO,MAAMA,wBAAwB,GAAG,CACvC,iBADuC,EAEvC,0BAFuC,EAGvC,mBAHuC,CAAjC","sourcesContent":["export const PAGE_CONTENT_BLOCK_TYPES = [\n\t'core/post-title',\n\t'core/post-featured-image',\n\t'core/post-content',\n];\n"]}

package/build/components/page-content-focus-manager/disable-non-page-content-blocks.js

@@ -0,0 +1,60 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = DisableNonPageContentBlocks;
+exports.useDisableNonPageContentBlocks = useDisableNonPageContentBlocks;
+
+var _element = require("@wordpress/element");
+
+var _compose = require("@wordpress/compose");
+
+var _hooks = require("@wordpress/hooks");
+
+var _blockEditor = require("@wordpress/block-editor");
+
+var _lockUnlock = require("../../lock-unlock");
+
+var _constants = require("./constants");
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+const {
+  useBlockEditingMode
+} = (0, _lockUnlock.unlock)(_blockEditor.privateApis);
+/**
+ * Component that when rendered, makes it so that the site editor allows only
+ * page content to be edited.
+ */
+
+function DisableNonPageContentBlocks() {
+  useDisableNonPageContentBlocks();
+}
+/**
+ * Disables non-content blocks using the `useBlockEditingMode` hook.
+ */
+
+
+function useDisableNonPageContentBlocks() {
+  useBlockEditingMode('disabled');
+  (0, _element.useEffect)(() => {
+    (0, _hooks.addFilter)('editor.BlockEdit', 'core/edit-site/disable-non-content-blocks', withDisableNonPageContentBlocks);
+    return () => (0, _hooks.removeFilter)('editor.BlockEdit', 'core/edit-site/disable-non-content-blocks');
+  }, []);
+}
+
+const withDisableNonPageContentBlocks = (0, _compose.createHigherOrderComponent)(BlockEdit => props => {
+  const isContent = _constants.PAGE_CONTENT_BLOCK_TYPES.includes(props.name);
+
+  const mode = isContent ? 'contentOnly' : undefined;
+  useBlockEditingMode(mode);
+  return (0, _element.createElement)(BlockEdit, { ...props
+  });
+}, 'withDisableNonPageContentBlocks');
+//# sourceMappingURL=disable-non-page-content-blocks.js.map

package/build/components/page-content-focus-manager/disable-non-page-content-blocks.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-content-focus-manager/disable-non-page-content-blocks.js"],"names":["useBlockEditingMode","blockEditorPrivateApis","DisableNonPageContentBlocks","useDisableNonPageContentBlocks","withDisableNonPageContentBlocks","BlockEdit","props","isContent","PAGE_CONTENT_BLOCK_TYPES","includes","name","mode","undefined"],"mappings":";;;;;;;;AAMA;;AAHA;;AACA;;AACA;;AAMA;;AACA;;AAZA;AACA;AACA;;AAMA;AACA;AACA;AAIA,MAAM;AAAEA,EAAAA;AAAF,IAA0B,wBAAQC,wBAAR,CAAhC;AAEA;AACA;AACA;AACA;;AACe,SAASC,2BAAT,GAAuC;AACrDC,EAAAA,8BAA8B;AAC9B;AAED;AACA;AACA;;;AACO,SAASA,8BAAT,GAA0C;AAChDH,EAAAA,mBAAmB,CAAE,UAAF,CAAnB;AACA,0BAAW,MAAM;AAChB,0BACC,kBADD,EAEC,2CAFD,EAGCI,+BAHD;AAKA,WAAO,MACN,yBACC,kBADD,EAEC,2CAFD,CADD;AAKA,GAXD,EAWG,EAXH;AAYA;;AAED,MAAMA,+BAA+B,GAAG,yCACrCC,SAAF,IAAmBC,KAAF,IAAa;AAC7B,QAAMC,SAAS,GAAGC,oCAAyBC,QAAzB,CAAmCH,KAAK,CAACI,IAAzC,CAAlB;;AACA,QAAMC,IAAI,GAAGJ,SAAS,GAAG,aAAH,GAAmBK,SAAzC;AACAZ,EAAAA,mBAAmB,CAAEW,IAAF,CAAnB;AACA,SAAO,4BAAC,SAAD,OAAgBL;AAAhB,IAAP;AACA,CANsC,EAOvC,iCAPuC,CAAxC","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createHigherOrderComponent } from '@wordpress/compose';\nimport { addFilter, removeFilter } from '@wordpress/hooks';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport { PAGE_CONTENT_BLOCK_TYPES } from './constants';\n\nconst { useBlockEditingMode } = unlock( blockEditorPrivateApis );\n\n/**\n * Component that when rendered, makes it so that the site editor allows only\n * page content to be edited.\n */\nexport default function DisableNonPageContentBlocks() {\n\tuseDisableNonPageContentBlocks();\n}\n\n/**\n * Disables non-content blocks using the `useBlockEditingMode` hook.\n */\nexport function useDisableNonPageContentBlocks() {\n\tuseBlockEditingMode( 'disabled' );\n\tuseEffect( () => {\n\t\taddFilter(\n\t\t\t'editor.BlockEdit',\n\t\t\t'core/edit-site/disable-non-content-blocks',\n\t\t\twithDisableNonPageContentBlocks\n\t\t);\n\t\treturn () =>\n\t\t\tremoveFilter(\n\t\t\t\t'editor.BlockEdit',\n\t\t\t\t'core/edit-site/disable-non-content-blocks'\n\t\t\t);\n\t}, [] );\n}\n\nconst withDisableNonPageContentBlocks = createHigherOrderComponent(\n\t( BlockEdit ) => ( props ) => {\n\t\tconst isContent = PAGE_CONTENT_BLOCK_TYPES.includes( props.name );\n\t\tconst mode = isContent ? 'contentOnly' : undefined;\n\t\tuseBlockEditingMode( mode );\n\t\treturn <BlockEdit { ...props } />;\n\t},\n\t'withDisableNonPageContentBlocks'\n);\n"]}

package/build/components/page-content-focus-manager/edit-template-notification.js

@@ -0,0 +1,121 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = EditTemplateNotification;
+
+var _element = require("@wordpress/element");
+
+var _data = require("@wordpress/data");
+
+var _notices = require("@wordpress/notices");
+
+var _i18n = require("@wordpress/i18n");
+
+var _components = require("@wordpress/components");
+
+var _store = require("../../store");
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+
+/**
+ * Component that:
+ *
+ * - Displays a 'Edit your template to edit this block' notification when the
+ *   user is focusing on editing page content and clicks on a disabled template
+ *   block.
+ * - Displays a 'Edit your template to edit this block' dialog when the user
+ *   is focusing on editing page conetnt and double clicks on a disabled
+ *   template block.
+ *
+ * @param {Object}                                 props
+ * @param {import('react').RefObject<HTMLElement>} props.contentRef Ref to the block
+ *                                                                  editor iframe canvas.
+ */
+function EditTemplateNotification({
+  contentRef
+}) {
+  const hasPageContentFocus = (0, _data.useSelect)(select => select(_store.store).hasPageContentFocus(), []);
+  const {
+    getNotices
+  } = (0, _data.useSelect)(_notices.store);
+  const {
+    createInfoNotice,
+    removeNotice
+  } = (0, _data.useDispatch)(_notices.store);
+  const {
+    setHasPageContentFocus
+  } = (0, _data.useDispatch)(_store.store);
+  const [isDialogOpen, setIsDialogOpen] = (0, _element.useState)(false);
+  const lastNoticeId = (0, _element.useRef)(0);
+  (0, _element.useEffect)(() => {
+    const handleClick = async event => {
+      if (!hasPageContentFocus) {
+        return;
+      }
+
+      if (!event.target.classList.contains('is-root-container')) {
+        return;
+      }
+
+      const isNoticeAlreadyShowing = getNotices().some(notice => notice.id === lastNoticeId.current);
+
+      if (isNoticeAlreadyShowing) {
+        return;
+      }
+
+      const {
+        notice
+      } = await createInfoNotice((0, _i18n.__)('Edit your template to edit this block.'), {
+        isDismissible: true,
+        type: 'snackbar',
+        actions: [{
+          label: (0, _i18n.__)('Edit template'),
+          onClick: () => setHasPageContentFocus(false)
+        }]
+      });
+      lastNoticeId.current = notice.id;
+    };
+
+    const handleDblClick = event => {
+      if (!hasPageContentFocus) {
+        return;
+      }
+
+      if (!event.target.classList.contains('is-root-container')) {
+        return;
+      }
+
+      if (lastNoticeId.current) {
+        removeNotice(lastNoticeId.current);
+      }
+
+      setIsDialogOpen(true);
+    };
+
+    const canvas = contentRef.current;
+    canvas?.addEventListener('click', handleClick);
+    canvas?.addEventListener('dblclick', handleDblClick);
+    return () => {
+      canvas?.removeEventListener('click', handleClick);
+      canvas?.removeEventListener('dblclick', handleDblClick);
+    };
+  }, [lastNoticeId, hasPageContentFocus, contentRef.current]);
+  return (0, _element.createElement)(_components.__experimentalConfirmDialog, {
+    isOpen: isDialogOpen,
+    confirmButtonText: (0, _i18n.__)('Edit template'),
+    onConfirm: () => {
+      setIsDialogOpen(false);
+      setHasPageContentFocus(false);
+    },
+    onCancel: () => setIsDialogOpen(false)
+  }, (0, _i18n.__)('Edit your template to edit this block.'));
+}
+//# sourceMappingURL=edit-template-notification.js.map

package/build/components/page-content-focus-manager/edit-template-notification.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-content-focus-manager/edit-template-notification.js"],"names":["EditTemplateNotification","contentRef","hasPageContentFocus","select","editSiteStore","getNotices","noticesStore","createInfoNotice","removeNotice","setHasPageContentFocus","isDialogOpen","setIsDialogOpen","lastNoticeId","handleClick","event","target","classList","contains","isNoticeAlreadyShowing","some","notice","id","current","isDismissible","type","actions","label","onClick","handleDblClick","canvas","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect, useState, useRef } from '@wordpress/element';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { __ } from '@wordpress/i18n';\nimport { __experimentalConfirmDialog as ConfirmDialog } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\n\n/**\n * Component that:\n *\n * - Displays a 'Edit your template to edit this block' notification when the\n *   user is focusing on editing page content and clicks on a disabled template\n *   block.\n * - Displays a 'Edit your template to edit this block' dialog when the user\n *   is focusing on editing page conetnt and double clicks on a disabled\n *   template block.\n *\n * @param {Object}                                 props\n * @param {import('react').RefObject<HTMLElement>} props.contentRef Ref to the block\n *                                                                  editor iframe canvas.\n */\nexport default function EditTemplateNotification( { contentRef } ) {\n\tconst hasPageContentFocus = useSelect(\n\t\t( select ) => select( editSiteStore ).hasPageContentFocus(),\n\t\t[]\n\t);\n\tconst { getNotices } = useSelect( noticesStore );\n\n\tconst { createInfoNotice, removeNotice } = useDispatch( noticesStore );\n\tconst { setHasPageContentFocus } = useDispatch( editSiteStore );\n\n\tconst [ isDialogOpen, setIsDialogOpen ] = useState( false );\n\n\tconst lastNoticeId = useRef( 0 );\n\n\tuseEffect( () => {\n\t\tconst handleClick = async ( event ) => {\n\t\t\tif ( ! hasPageContentFocus ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif ( ! event.target.classList.contains( 'is-root-container' ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst isNoticeAlreadyShowing = getNotices().some(\n\t\t\t\t( notice ) => notice.id === lastNoticeId.current\n\t\t\t);\n\t\t\tif ( isNoticeAlreadyShowing ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst { notice } = await createInfoNotice(\n\t\t\t\t__( 'Edit your template to edit this block.' ),\n\t\t\t\t{\n\t\t\t\t\tisDismissible: true,\n\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\tactions: [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tlabel: __( 'Edit template' ),\n\t\t\t\t\t\t\tonClick: () => setHasPageContentFocus( false ),\n\t\t\t\t\t\t},\n\t\t\t\t\t],\n\t\t\t\t}\n\t\t\t);\n\t\t\tlastNoticeId.current = notice.id;\n\t\t};\n\n\t\tconst handleDblClick = ( event ) => {\n\t\t\tif ( ! hasPageContentFocus ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif ( ! event.target.classList.contains( 'is-root-container' ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif ( lastNoticeId.current ) {\n\t\t\t\tremoveNotice( lastNoticeId.current );\n\t\t\t}\n\t\t\tsetIsDialogOpen( true );\n\t\t};\n\n\t\tconst canvas = contentRef.current;\n\t\tcanvas?.addEventListener( 'click', handleClick );\n\t\tcanvas?.addEventListener( 'dblclick', handleDblClick );\n\t\treturn () => {\n\t\t\tcanvas?.removeEventListener( 'click', handleClick );\n\t\t\tcanvas?.removeEventListener( 'dblclick', handleDblClick );\n\t\t};\n\t}, [ lastNoticeId, hasPageContentFocus, contentRef.current ] );\n\n\treturn (\n\t\t<ConfirmDialog\n\t\t\tisOpen={ isDialogOpen }\n\t\t\tconfirmButtonText={ __( 'Edit template' ) }\n\t\t\tonConfirm={ () => {\n\t\t\t\tsetIsDialogOpen( false );\n\t\t\t\tsetHasPageContentFocus( false );\n\t\t\t} }\n\t\t\tonCancel={ () => setIsDialogOpen( false ) }\n\t\t>\n\t\t\t{ __( 'Edit your template to edit this block.' ) }\n\t\t</ConfirmDialog>\n\t);\n}\n"]}

package/build/components/page-content-focus-manager/index.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = PageContentFocusManager;
+
+var _element = require("@wordpress/element");
+
+var _data = require("@wordpress/data");
+
+var _store = require("../../store");
+
+var _disableNonPageContentBlocks = _interopRequireDefault(require("./disable-non-page-content-blocks"));
+
+var _editTemplateNotification = _interopRequireDefault(require("./edit-template-notification"));
+
+var _backToPageNotification = _interopRequireDefault(require("./back-to-page-notification"));
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+function PageContentFocusManager({
+  contentRef
+}) {
+  const hasPageContentFocus = (0, _data.useSelect)(select => select(_store.store).hasPageContentFocus(), []);
+  return (0, _element.createElement)(_element.Fragment, null, hasPageContentFocus && (0, _element.createElement)(_disableNonPageContentBlocks.default, null), (0, _element.createElement)(_editTemplateNotification.default, {
+    contentRef: contentRef
+  }), (0, _element.createElement)(_backToPageNotification.default, null));
+}
+//# sourceMappingURL=index.js.map

package/build/components/page-content-focus-manager/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-content-focus-manager/index.js"],"names":["PageContentFocusManager","contentRef","hasPageContentFocus","select","editSiteStore"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AACA;;AACA;;AACA;;AAXA;AACA;AACA;;AAGA;AACA;AACA;AAMe,SAASA,uBAAT,CAAkC;AAAEC,EAAAA;AAAF,CAAlC,EAAmD;AACjE,QAAMC,mBAAmB,GAAG,qBACzBC,MAAF,IAAcA,MAAM,CAAEC,YAAF,CAAN,CAAwBF,mBAAxB,EADa,EAE3B,EAF2B,CAA5B;AAIA,SACC,qDACGA,mBAAmB,IAAI,4BAAC,oCAAD,OAD1B,EAEC,4BAAC,iCAAD;AAA0B,IAAA,UAAU,EAAGD;AAAvC,IAFD,EAGC,4BAAC,+BAAD,OAHD,CADD;AAOA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport DisableNonPageContentBlocks from './disable-non-page-content-blocks';\nimport EditTemplateNotification from './edit-template-notification';\nimport BackToPageNotification from './back-to-page-notification';\n\nexport default function PageContentFocusManager( { contentRef } ) {\n\tconst hasPageContentFocus = useSelect(\n\t\t( select ) => select( editSiteStore ).hasPageContentFocus(),\n\t\t[]\n\t);\n\treturn (\n\t\t<>\n\t\t\t{ hasPageContentFocus && <DisableNonPageContentBlocks /> }\n\t\t\t<EditTemplateNotification contentRef={ contentRef } />\n\t\t\t<BackToPageNotification />\n\t\t</>\n\t);\n}\n"]}

package/build/components/page-library/grid-item.js

@@ -0,0 +1,165 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = GridItem;
+
+var _element = require("@wordpress/element");
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _blockEditor = require("@wordpress/block-editor");
+
+var _components = require("@wordpress/components");
+
+var _compose = require("@wordpress/compose");
+
+var _data = require("@wordpress/data");
+
+var _i18n = require("@wordpress/i18n");
+
+var _icons = require("@wordpress/icons");
+
+var _notices = require("@wordpress/notices");
+
+var _reusableBlocks = require("@wordpress/reusable-blocks");
+
+var _keycodes = require("@wordpress/keycodes");
+
+var _utils = require("./utils");
+
+var _link = require("../routes/link");
+
+/**
+ * External dependencies
+ */
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+function GridItem({
+  categoryId,
+  composite,
+  icon,
+  item
+}) {
+  const instanceId = (0, _compose.useInstanceId)(GridItem);
+  const descriptionId = `edit-site-library__pattern-description-${instanceId}`;
+  const [isDeleteDialogOpen, setIsDeleteDialogOpen] = (0, _element.useState)(false);
+  const {
+    __experimentalDeleteReusableBlock
+  } = (0, _data.useDispatch)(_reusableBlocks.store);
+  const {
+    createErrorNotice,
+    createSuccessNotice
+  } = (0, _data.useDispatch)(_notices.store);
+  const {
+    onClick
+  } = (0, _link.useLink)({
+    postType: item.type,
+    postId: item.type === _utils.USER_PATTERNS ? item.id : item.name,
+    categoryId,
+    categoryType: item.type,
+    canvas: 'edit'
+  });
+  const isEmpty = !item.blocks?.length;
+  const patternClassNames = (0, _classnames.default)('edit-site-library__pattern', {
+    'is-placeholder': isEmpty
+  });
+  const previewClassNames = (0, _classnames.default)('edit-site-library__preview', {
+    'is-inactive': item.type === _utils.PATTERNS
+  });
+
+  const deletePattern = async () => {
+    try {
+      await __experimentalDeleteReusableBlock(item.id);
+      createSuccessNotice((0, _i18n.__)('Pattern successfully deleted.'), {
+        type: 'snackbar'
+      });
+    } catch (error) {
+      const errorMessage = error.message && error.code !== 'unknown_error' ? error.message : (0, _i18n.__)('An error occurred while deleting the pattern.');
+      createErrorNotice(errorMessage, {
+        type: 'snackbar'
+      });
+    }
+  };
+
+  let ariaDescription;
+
+  if (item.type === _utils.USER_PATTERNS) {
+    // User patterns don't have descriptions, but can be edited and deleted, so include some help text.
+    ariaDescription = (0, _i18n.__)('Press Enter to edit, or Delete to delete the pattern.');
+  } else if (item.description) {
+    ariaDescription = item.description;
+  }
+
+  return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)("div", {
+    className: patternClassNames
+  }, (0, _element.createElement)(_components.__unstableCompositeItem, {
+    className: previewClassNames,
+    role: "option",
+    as: "div",
+    ...composite,
+    onClick: item.type !== _utils.PATTERNS ? onClick : undefined,
+    "aria-label": item.title,
+    "aria-describedby": ariaDescription ? descriptionId : undefined,
+    onKeyDown: event => {
+      if (_keycodes.DELETE === event.keyCode || _keycodes.BACKSPACE === event.keyCode) {
+        setIsDeleteDialogOpen(true);
+      }
+    }
+  }, isEmpty && (0, _i18n.__)('Empty pattern'), !isEmpty && (0, _element.createElement)(_blockEditor.BlockPreview, {
+    blocks: item.blocks
+  })), ariaDescription && (0, _element.createElement)("div", {
+    "aria-hidden": "true",
+    style: {
+      display: 'none'
+    },
+    id: descriptionId
+  }, ariaDescription), (0, _element.createElement)(_components.__experimentalHStack, {
+    "aria-hidden": "true",
+    className: "edit-site-library__footer",
+    justify: "space-between"
+  }, (0, _element.createElement)(_components.__experimentalHStack, {
+    alignment: "center",
+    justify: "left",
+    spacing: 3,
+    className: "edit-site-library__pattern-title"
+  }, icon && (0, _element.createElement)(_icons.Icon, {
+    icon: icon
+  }), (0, _element.createElement)(_components.__experimentalHeading, {
+    level: 5
+  }, item.title)), item.type === _utils.USER_PATTERNS && (0, _element.createElement)(_components.DropdownMenu, {
+    icon: _icons.moreHorizontal,
+    label: (0, _i18n.__)('Actions'),
+    className: "edit-site-library__dropdown",
+    popoverProps: {
+      placement: 'bottom-end'
+    },
+    toggleProps: {
+      className: 'edit-site-library__button',
+      isSmall: true,
+      describedBy: (0, _i18n.sprintf)(
+      /* translators: %s: pattern name */
+      (0, _i18n.__)('Action menu for %s pattern'), item.title),
+      // The dropdown menu is not focusable using the
+      // keyboard as this would interfere with the grid's
+      // roving tab index system. Instead, keyboard users
+      // use keyboard shortcuts to trigger actions.
+      tabIndex: -1
+    }
+  }, () => (0, _element.createElement)(_components.MenuGroup, null, (0, _element.createElement)(_components.MenuItem, {
+    onClick: () => setIsDeleteDialogOpen(true)
+  }, (0, _i18n.__)('Delete')))))), isDeleteDialogOpen && (0, _element.createElement)(_components.__experimentalConfirmDialog, {
+    onConfirm: deletePattern,
+    onCancel: () => setIsDeleteDialogOpen(false)
+  }, (0, _i18n.__)('Are you sure you want to delete this pattern?')));
+}
+//# sourceMappingURL=grid-item.js.map

package/build/components/page-library/grid-item.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-library/grid-item.js"],"names":["GridItem","categoryId","composite","icon","item","instanceId","descriptionId","isDeleteDialogOpen","setIsDeleteDialogOpen","__experimentalDeleteReusableBlock","reusableBlocksStore","createErrorNotice","createSuccessNotice","noticesStore","onClick","postType","type","postId","USER_PATTERNS","id","name","categoryType","canvas","isEmpty","blocks","length","patternClassNames","previewClassNames","PATTERNS","deletePattern","error","errorMessage","message","code","ariaDescription","description","undefined","title","event","DELETE","keyCode","BACKSPACE","display","moreHorizontal","placement","className","isSmall","describedBy","tabIndex"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { BlockPreview } from '@wordpress/block-editor';\nimport {\n\t__experimentalConfirmDialog as ConfirmDialog,\n\tDropdownMenu,\n\tMenuGroup,\n\tMenuItem,\n\t__experimentalHeading as Heading,\n\t__experimentalHStack as HStack,\n\t__unstableCompositeItem as CompositeItem,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport { useDispatch } from '@wordpress/data';\nimport { useState } from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Icon, moreHorizontal } from '@wordpress/icons';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { store as reusableBlocksStore } from '@wordpress/reusable-blocks';\nimport { DELETE, BACKSPACE } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { PATTERNS, USER_PATTERNS } from './utils';\nimport { useLink } from '../routes/link';\n\nexport default function GridItem( { categoryId, composite, icon, item } ) {\n\tconst instanceId = useInstanceId( GridItem );\n\tconst descriptionId = `edit-site-library__pattern-description-${ instanceId }`;\n\tconst [ isDeleteDialogOpen, setIsDeleteDialogOpen ] = useState( false );\n\n\tconst { __experimentalDeleteReusableBlock } =\n\t\tuseDispatch( reusableBlocksStore );\n\tconst { createErrorNotice, createSuccessNotice } =\n\t\tuseDispatch( noticesStore );\n\n\tconst { onClick } = useLink( {\n\t\tpostType: item.type,\n\t\tpostId: item.type === USER_PATTERNS ? item.id : item.name,\n\t\tcategoryId,\n\t\tcategoryType: item.type,\n\t\tcanvas: 'edit',\n\t} );\n\n\tconst isEmpty = ! item.blocks?.length;\n\tconst patternClassNames = classnames( 'edit-site-library__pattern', {\n\t\t'is-placeholder': isEmpty,\n\t} );\n\tconst previewClassNames = classnames( 'edit-site-library__preview', {\n\t\t'is-inactive': item.type === PATTERNS,\n\t} );\n\n\tconst deletePattern = async () => {\n\t\ttry {\n\t\t\tawait __experimentalDeleteReusableBlock( item.id );\n\t\t\tcreateSuccessNotice( __( 'Pattern successfully deleted.' ), {\n\t\t\t\ttype: 'snackbar',\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 deleting the pattern.' );\n\t\t\tcreateErrorNotice( errorMessage, { type: 'snackbar' } );\n\t\t}\n\t};\n\n\tlet ariaDescription;\n\tif ( item.type === USER_PATTERNS ) {\n\t\t// User patterns don't have descriptions, but can be edited and deleted, so include some help text.\n\t\tariaDescription = __(\n\t\t\t'Press Enter to edit, or Delete to delete the pattern.'\n\t\t);\n\t} else if ( item.description ) {\n\t\tariaDescription = item.description;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<div className={ patternClassNames }>\n\t\t\t\t<CompositeItem\n\t\t\t\t\tclassName={ previewClassNames }\n\t\t\t\t\trole=\"option\"\n\t\t\t\t\tas=\"div\"\n\t\t\t\t\t{ ...composite }\n\t\t\t\t\tonClick={ item.type !== PATTERNS ? onClick : undefined }\n\t\t\t\t\taria-label={ item.title }\n\t\t\t\t\taria-describedby={\n\t\t\t\t\t\tariaDescription ? descriptionId : undefined\n\t\t\t\t\t}\n\t\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\tif (\n\t\t\t\t\t\t\tDELETE === event.keyCode ||\n\t\t\t\t\t\t\tBACKSPACE === event.keyCode\n\t\t\t\t\t\t) {\n\t\t\t\t\t\t\tsetIsDeleteDialogOpen( true );\n\t\t\t\t\t\t}\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ isEmpty && __( 'Empty pattern' ) }\n\t\t\t\t\t{ ! isEmpty && <BlockPreview blocks={ item.blocks } /> }\n\t\t\t\t</CompositeItem>\n\t\t\t\t{ ariaDescription && (\n\t\t\t\t\t<div\n\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\tstyle={ { display: 'none' } }\n\t\t\t\t\t\tid={ descriptionId }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ariaDescription }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t<HStack\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tclassName=\"edit-site-library__footer\"\n\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\talignment=\"center\"\n\t\t\t\t\t\tjustify=\"left\"\n\t\t\t\t\t\tspacing={ 3 }\n\t\t\t\t\t\tclassName=\"edit-site-library__pattern-title\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ icon && <Icon icon={ icon } /> }\n\t\t\t\t\t\t<Heading level={ 5 }>{ item.title }</Heading>\n\t\t\t\t\t</HStack>\n\t\t\t\t\t{ item.type === USER_PATTERNS && (\n\t\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\t\ticon={ moreHorizontal }\n\t\t\t\t\t\t\tlabel={ __( 'Actions' ) }\n\t\t\t\t\t\t\tclassName=\"edit-site-library__dropdown\"\n\t\t\t\t\t\t\tpopoverProps={ { placement: 'bottom-end' } }\n\t\t\t\t\t\t\ttoggleProps={ {\n\t\t\t\t\t\t\t\tclassName: 'edit-site-library__button',\n\t\t\t\t\t\t\t\tisSmall: true,\n\t\t\t\t\t\t\t\tdescribedBy: sprintf(\n\t\t\t\t\t\t\t\t\t/* translators: %s: pattern name */\n\t\t\t\t\t\t\t\t\t__( 'Action menu for %s pattern' ),\n\t\t\t\t\t\t\t\t\titem.title\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t// The dropdown menu is not focusable using the\n\t\t\t\t\t\t\t\t// keyboard as this would interfere with the grid's\n\t\t\t\t\t\t\t\t// roving tab index system. Instead, keyboard users\n\t\t\t\t\t\t\t\t// use keyboard shortcuts to trigger actions.\n\t\t\t\t\t\t\t\ttabIndex: -1,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ () => (\n\t\t\t\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\t\tsetIsDeleteDialogOpen( true )\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Delete' ) }\n\t\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</DropdownMenu>\n\t\t\t\t\t) }\n\t\t\t\t</HStack>\n\t\t\t</div>\n\t\t\t{ isDeleteDialogOpen && (\n\t\t\t\t<ConfirmDialog\n\t\t\t\t\tonConfirm={ deletePattern }\n\t\t\t\t\tonCancel={ () => setIsDeleteDialogOpen( false ) }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Are you sure you want to delete this pattern?' ) }\n\t\t\t\t</ConfirmDialog>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"]}

package/build/components/page-library/grid.js

@@ -0,0 +1,49 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = Grid;
+
+var _element = require("@wordpress/element");
+
+var _components = require("@wordpress/components");
+
+var _gridItem = _interopRequireDefault(require("./grid-item"));
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+function Grid({
+  categoryId,
+  label,
+  icon,
+  items
+}) {
+  const composite = (0, _components.__unstableUseCompositeState)({
+    orientation: 'vertical'
+  });
+
+  if (!items?.length) {
+    return null;
+  }
+
+  return (0, _element.createElement)(_components.__unstableComposite, { ...composite,
+    role: "listbox",
+    className: "edit-site-library__grid",
+    "aria-label": label
+  }, items.map(item => (0, _element.createElement)(_gridItem.default, {
+    key: item.name,
+    icon: icon,
+    item: item,
+    categoryId: categoryId,
+    composite: composite
+  })));
+}
+//# sourceMappingURL=grid.js.map

package/build/components/page-library/grid.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-library/grid.js"],"names":["Grid","categoryId","label","icon","items","composite","orientation","length","map","item","name"],"mappings":";;;;;;;;;;;AAGA;;AAQA;;AAXA;AACA;AACA;;AAMA;AACA;AACA;AAGe,SAASA,IAAT,CAAe;AAAEC,EAAAA,UAAF;AAAcC,EAAAA,KAAd;AAAqBC,EAAAA,IAArB;AAA2BC,EAAAA;AAA3B,CAAf,EAAoD;AAClE,QAAMC,SAAS,GAAG,6CAAmB;AAAEC,IAAAA,WAAW,EAAE;AAAf,GAAnB,CAAlB;;AAEA,MAAK,CAAEF,KAAK,EAAEG,MAAd,EAAuB;AACtB,WAAO,IAAP;AACA;;AAED,SACC,4BAAC,+BAAD,OACMF,SADN;AAEC,IAAA,IAAI,EAAC,SAFN;AAGC,IAAA,SAAS,EAAC,yBAHX;AAIC,kBAAaH;AAJd,KAMGE,KAAK,CAACI,GAAN,CAAaC,IAAF,IACZ,4BAAC,iBAAD;AACC,IAAA,GAAG,EAAGA,IAAI,CAACC,IADZ;AAEC,IAAA,IAAI,EAAGP,IAFR;AAGC,IAAA,IAAI,EAAGM,IAHR;AAIC,IAAA,UAAU,EAAGR,UAJd;AAKC,IAAA,SAAS,EAAGI;AALb,IADC,CANH,CADD;AAkBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__unstableComposite as Composite,\n\t__unstableUseCompositeState as useCompositeState,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport GridItem from './grid-item';\n\nexport default function Grid( { categoryId, label, icon, items } ) {\n\tconst composite = useCompositeState( { orientation: 'vertical' } );\n\n\tif ( ! items?.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Composite\n\t\t\t{ ...composite }\n\t\t\trole=\"listbox\"\n\t\t\tclassName=\"edit-site-library__grid\"\n\t\t\taria-label={ label }\n\t\t>\n\t\t\t{ items.map( ( item ) => (\n\t\t\t\t<GridItem\n\t\t\t\t\tkey={ item.name }\n\t\t\t\t\ticon={ icon }\n\t\t\t\t\titem={ item }\n\t\t\t\t\tcategoryId={ categoryId }\n\t\t\t\t\tcomposite={ composite }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</Composite>\n\t);\n}\n"]}

package/build/components/page-library/index.js

@@ -0,0 +1,61 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = PageLibrary;
+
+var _element = require("@wordpress/element");
+
+var _i18n = require("@wordpress/i18n");
+
+var _blockEditor = require("@wordpress/block-editor");
+
+var _url = require("@wordpress/url");
+
+var _utils = require("./utils");
+
+var _page = _interopRequireDefault(require("../page"));
+
+var _patternsList = _interopRequireDefault(require("./patterns-list"));
+
+var _useLibrarySettings = _interopRequireDefault(require("./use-library-settings"));
+
+var _lockUnlock = require("../../lock-unlock");
+
+/**
+ * WordPress dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+const {
+  ExperimentalBlockEditorProvider
+} = (0, _lockUnlock.unlock)(_blockEditor.privateApis);
+
+function PageLibrary() {
+  const {
+    categoryType,
+    categoryId
+  } = (0, _url.getQueryArgs)(window.location.href);
+  const type = categoryType || _utils.DEFAULT_TYPE;
+  const category = categoryId || _utils.DEFAULT_CATEGORY;
+  const settings = (0, _useLibrarySettings.default)(); // Wrap everything in a block editor provider.
+  // This ensures 'styles' that are needed for the previews are synced
+  // from the site editor store to the block editor store.
+
+  return (0, _element.createElement)(ExperimentalBlockEditorProvider, {
+    settings: settings
+  }, (0, _element.createElement)(_page.default, {
+    className: "edit-site-library",
+    title: (0, _i18n.__)('Library content'),
+    hideTitleFromUI: true
+  }, (0, _element.createElement)(_patternsList.default, {
+    type: type,
+    categoryId: category
+  })));
+}
+//# sourceMappingURL=index.js.map

package/build/components/page-library/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-library/index.js"],"names":["ExperimentalBlockEditorProvider","blockEditorPrivateApis","PageLibrary","categoryType","categoryId","window","location","href","type","DEFAULT_TYPE","category","DEFAULT_CATEGORY","settings"],"mappings":";;;;;;;;;;;AAGA;;AACA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAdA;AACA;AACA;;AAKA;AACA;AACA;AAOA,MAAM;AAAEA,EAAAA;AAAF,IAAsC,wBAAQC,wBAAR,CAA5C;;AAEe,SAASC,WAAT,GAAuB;AACrC,QAAM;AAAEC,IAAAA,YAAF;AAAgBC,IAAAA;AAAhB,MAA+B,uBAAcC,MAAM,CAACC,QAAP,CAAgBC,IAA9B,CAArC;AACA,QAAMC,IAAI,GAAGL,YAAY,IAAIM,mBAA7B;AACA,QAAMC,QAAQ,GAAGN,UAAU,IAAIO,uBAA/B;AACA,QAAMC,QAAQ,GAAG,kCAAjB,CAJqC,CAMrC;AACA;AACA;;AACA,SACC,4BAAC,+BAAD;AAAiC,IAAA,QAAQ,EAAGA;AAA5C,KACC,4BAAC,aAAD;AACC,IAAA,SAAS,EAAC,mBADX;AAEC,IAAA,KAAK,EAAG,cAAI,iBAAJ,CAFT;AAGC,IAAA,eAAe;AAHhB,KAKC,4BAAC,qBAAD;AAAc,IAAA,IAAI,EAAGJ,IAArB;AAA4B,IAAA,UAAU,EAAGE;AAAzC,IALD,CADD,CADD;AAWA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { getQueryArgs } from '@wordpress/url';\n\n/**\n * Internal dependencies\n */\nimport { DEFAULT_CATEGORY, DEFAULT_TYPE } from './utils';\nimport Page from '../page';\nimport PatternsList from './patterns-list';\nimport useLibrarySettings from './use-library-settings';\nimport { unlock } from '../../lock-unlock';\n\nconst { ExperimentalBlockEditorProvider } = unlock( blockEditorPrivateApis );\n\nexport default function PageLibrary() {\n\tconst { categoryType, categoryId } = getQueryArgs( window.location.href );\n\tconst type = categoryType || DEFAULT_TYPE;\n\tconst category = categoryId || DEFAULT_CATEGORY;\n\tconst settings = useLibrarySettings();\n\n\t// Wrap everything in a block editor provider.\n\t// This ensures 'styles' that are needed for the previews are synced\n\t// from the site editor store to the block editor store.\n\treturn (\n\t\t<ExperimentalBlockEditorProvider settings={ settings }>\n\t\t\t<Page\n\t\t\t\tclassName=\"edit-site-library\"\n\t\t\t\ttitle={ __( 'Library content' ) }\n\t\t\t\thideTitleFromUI\n\t\t\t>\n\t\t\t\t<PatternsList type={ type } categoryId={ category } />\n\t\t\t</Page>\n\t\t</ExperimentalBlockEditorProvider>\n\t);\n}\n"]}

package/build/components/page-library/no-patterns.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = NoPatterns;
+
+var _element = require("@wordpress/element");
+
+var _i18n = require("@wordpress/i18n");
+
+/**
+ * WordPress dependencies
+ */
+function NoPatterns() {
+  return (0, _element.createElement)("div", {
+    className: "edit-site-library__no-results"
+  }, (0, _i18n.__)('No patterns found.'));
+}
+//# sourceMappingURL=no-patterns.js.map

package/build/components/page-library/no-patterns.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/page-library/no-patterns.js"],"names":["NoPatterns"],"mappings":";;;;;;;;;AAGA;;AAHA;AACA;AACA;AAGe,SAASA,UAAT,GAAsB;AACpC,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACG,cAAI,oBAAJ,CADH,CADD;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\nexport default function NoPatterns() {\n\treturn (\n\t\t<div className=\"edit-site-library__no-results\">\n\t\t\t{ __( 'No patterns found.' ) }\n\t\t</div>\n\t);\n}\n"]}