@wordpress/edit-site 5.3.6 → 5.3.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (132) hide show
  1. package/build/components/block-editor/editor-canvas.js +2 -1
  2. package/build/components/block-editor/editor-canvas.js.map +1 -1
  3. package/build/components/layout/index.js +6 -0
  4. package/build/components/layout/index.js.map +1 -1
  5. package/build/components/list/index.js +2 -1
  6. package/build/components/list/index.js.map +1 -1
  7. package/build/components/routes/link.js +4 -1
  8. package/build/components/routes/link.js.map +1 -1
  9. package/build/components/save-button/index.js +2 -5
  10. package/build/components/save-button/index.js.map +1 -1
  11. package/build/components/save-hub/index.js +82 -0
  12. package/build/components/save-hub/index.js.map +1 -0
  13. package/build/components/sidebar/index.js +2 -4
  14. package/build/components/sidebar/index.js.map +1 -1
  15. package/build/components/sidebar-navigation-screen/index.js +5 -2
  16. package/build/components/sidebar-navigation-screen/index.js.map +1 -1
  17. package/build/components/sidebar-navigation-screen-main/index.js +1 -0
  18. package/build/components/sidebar-navigation-screen-main/index.js.map +1 -1
  19. package/build/components/sidebar-navigation-screen-navigation-item/index.js +9 -14
  20. package/build/components/sidebar-navigation-screen-navigation-item/index.js.map +1 -1
  21. package/build/components/sidebar-navigation-screen-navigation-menus/index.js +139 -11
  22. package/build/components/sidebar-navigation-screen-navigation-menus/index.js.map +1 -1
  23. package/build/components/sidebar-navigation-screen-navigation-menus/loader.js +19 -0
  24. package/build/components/sidebar-navigation-screen-navigation-menus/loader.js.map +1 -0
  25. package/build/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js +77 -0
  26. package/build/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js.map +1 -0
  27. package/build/components/sidebar-navigation-screen-template/index.js +18 -4
  28. package/build/components/sidebar-navigation-screen-template/index.js.map +1 -1
  29. package/build/components/sidebar-navigation-screen-templates/index.js +5 -2
  30. package/build/components/sidebar-navigation-screen-templates/index.js.map +1 -1
  31. package/build/components/sidebar-navigation-screen-templates-browse/index.js +6 -3
  32. package/build/components/sidebar-navigation-screen-templates-browse/index.js.map +1 -1
  33. package/build/components/sync-state-with-url/use-sync-canvas-mode-with-url.js +24 -8
  34. package/build/components/sync-state-with-url/use-sync-canvas-mode-with-url.js.map +1 -1
  35. package/build/components/sync-state-with-url/use-sync-path-with-url.js +9 -7
  36. package/build/components/sync-state-with-url/use-sync-path-with-url.js.map +1 -1
  37. package/build/components/template-details/index.js +0 -3
  38. package/build/components/template-details/index.js.map +1 -1
  39. package/build/components/use-edited-entity-record/index.js +6 -6
  40. package/build/components/use-edited-entity-record/index.js.map +1 -1
  41. package/build/index.js +3 -0
  42. package/build/index.js.map +1 -1
  43. package/build/utils/history.js +8 -2
  44. package/build/utils/history.js.map +1 -1
  45. package/build-module/components/block-editor/editor-canvas.js +2 -1
  46. package/build-module/components/block-editor/editor-canvas.js.map +1 -1
  47. package/build-module/components/layout/index.js +6 -0
  48. package/build-module/components/layout/index.js.map +1 -1
  49. package/build-module/components/list/index.js +2 -1
  50. package/build-module/components/list/index.js.map +1 -1
  51. package/build-module/components/routes/link.js +5 -2
  52. package/build-module/components/routes/link.js.map +1 -1
  53. package/build-module/components/save-button/index.js +2 -5
  54. package/build-module/components/save-button/index.js.map +1 -1
  55. package/build-module/components/save-hub/index.js +68 -0
  56. package/build-module/components/save-hub/index.js.map +1 -0
  57. package/build-module/components/sidebar/index.js +2 -4
  58. package/build-module/components/sidebar/index.js.map +1 -1
  59. package/build-module/components/sidebar-navigation-screen/index.js +5 -2
  60. package/build-module/components/sidebar-navigation-screen/index.js.map +1 -1
  61. package/build-module/components/sidebar-navigation-screen-main/index.js +1 -0
  62. package/build-module/components/sidebar-navigation-screen-main/index.js.map +1 -1
  63. package/build-module/components/sidebar-navigation-screen-navigation-item/index.js +13 -18
  64. package/build-module/components/sidebar-navigation-screen-navigation-item/index.js.map +1 -1
  65. package/build-module/components/sidebar-navigation-screen-navigation-menus/index.js +131 -11
  66. package/build-module/components/sidebar-navigation-screen-navigation-menus/index.js.map +1 -1
  67. package/build-module/components/sidebar-navigation-screen-navigation-menus/loader.js +11 -0
  68. package/build-module/components/sidebar-navigation-screen-navigation-menus/loader.js.map +1 -0
  69. package/build-module/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js +66 -0
  70. package/build-module/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js.map +1 -0
  71. package/build-module/components/sidebar-navigation-screen-template/index.js +18 -5
  72. package/build-module/components/sidebar-navigation-screen-template/index.js.map +1 -1
  73. package/build-module/components/sidebar-navigation-screen-templates/index.js +5 -2
  74. package/build-module/components/sidebar-navigation-screen-templates/index.js.map +1 -1
  75. package/build-module/components/sidebar-navigation-screen-templates-browse/index.js +6 -3
  76. package/build-module/components/sidebar-navigation-screen-templates-browse/index.js.map +1 -1
  77. package/build-module/components/sync-state-with-url/use-sync-canvas-mode-with-url.js +24 -8
  78. package/build-module/components/sync-state-with-url/use-sync-canvas-mode-with-url.js.map +1 -1
  79. package/build-module/components/sync-state-with-url/use-sync-path-with-url.js +9 -7
  80. package/build-module/components/sync-state-with-url/use-sync-path-with-url.js.map +1 -1
  81. package/build-module/components/template-details/index.js +0 -3
  82. package/build-module/components/template-details/index.js.map +1 -1
  83. package/build-module/components/use-edited-entity-record/index.js +6 -6
  84. package/build-module/components/use-edited-entity-record/index.js.map +1 -1
  85. package/build-module/index.js +4 -1
  86. package/build-module/index.js.map +1 -1
  87. package/build-module/utils/history.js +9 -3
  88. package/build-module/utils/history.js.map +1 -1
  89. package/build-style/style-rtl.css +80 -67
  90. package/build-style/style.css +80 -67
  91. package/package.json +7 -7
  92. package/src/components/block-editor/editor-canvas.js +2 -1
  93. package/src/components/layout/index.js +14 -0
  94. package/src/components/layout/style.scss +1 -3
  95. package/src/components/list/index.js +3 -1
  96. package/src/components/routes/link.js +9 -2
  97. package/src/components/save-button/index.js +2 -2
  98. package/src/components/save-hub/index.js +78 -0
  99. package/src/components/save-hub/style.scss +15 -0
  100. package/src/components/sidebar/index.js +2 -3
  101. package/src/components/sidebar/style.scss +4 -3
  102. package/src/components/sidebar-button/style.scss +2 -1
  103. package/src/components/sidebar-navigation-item/style.scss +0 -20
  104. package/src/components/sidebar-navigation-screen/index.js +6 -0
  105. package/src/components/sidebar-navigation-screen/style.scss +15 -0
  106. package/src/components/sidebar-navigation-screen-main/index.js +3 -0
  107. package/src/components/sidebar-navigation-screen-navigation-item/index.js +30 -21
  108. package/src/components/sidebar-navigation-screen-navigation-menus/index.js +141 -10
  109. package/src/components/sidebar-navigation-screen-navigation-menus/loader.js +9 -0
  110. package/src/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js +78 -0
  111. package/src/components/sidebar-navigation-screen-navigation-menus/style.scss +55 -4
  112. package/src/components/sidebar-navigation-screen-template/index.js +21 -7
  113. package/src/components/sidebar-navigation-screen-templates/index.js +7 -0
  114. package/src/components/sidebar-navigation-screen-templates-browse/index.js +12 -1
  115. package/src/components/sync-state-with-url/use-sync-canvas-mode-with-url.js +38 -8
  116. package/src/components/sync-state-with-url/use-sync-path-with-url.js +12 -7
  117. package/src/components/template-details/index.js +0 -3
  118. package/src/components/use-edited-entity-record/index.js +26 -18
  119. package/src/index.js +5 -1
  120. package/src/style.scss +1 -1
  121. package/src/utils/history.js +13 -9
  122. package/build/components/navigation-inspector/index.js +0 -190
  123. package/build/components/navigation-inspector/index.js.map +0 -1
  124. package/build/components/navigation-inspector/navigation-menu.js +0 -62
  125. package/build/components/navigation-inspector/navigation-menu.js.map +0 -1
  126. package/build-module/components/navigation-inspector/index.js +0 -173
  127. package/build-module/components/navigation-inspector/index.js.map +0 -1
  128. package/build-module/components/navigation-inspector/navigation-menu.js +0 -52
  129. package/build-module/components/navigation-inspector/navigation-menu.js.map +0 -1
  130. package/src/components/navigation-inspector/index.js +0 -223
  131. package/src/components/navigation-inspector/navigation-menu.js +0 -66
  132. package/src/components/navigation-inspector/style.scss +0 -46
@@ -1,173 +0,0 @@
1
- import { createElement, Fragment } from "@wordpress/element";
2
-
3
- /**
4
- * WordPress dependencies
5
- */
6
- import { useSelect } from '@wordpress/data';
7
- import { useState, useEffect } from '@wordpress/element';
8
- import { SelectControl } from '@wordpress/components';
9
- import { store as coreStore, useEntityBlockEditor } from '@wordpress/core-data';
10
- import { store as blockEditorStore, BlockEditorProvider } from '@wordpress/block-editor';
11
- import { speak } from '@wordpress/a11y';
12
- import { useInstanceId } from '@wordpress/compose';
13
- import { __ } from '@wordpress/i18n';
14
- /**
15
- * Internal dependencies
16
- */
17
-
18
- import NavigationMenu from './navigation-menu';
19
- const NAVIGATION_MENUS_QUERY = [{
20
- per_page: -1,
21
- status: 'publish'
22
- }];
23
- export default function NavigationInspector(_ref) {
24
- var _navigationMenus$;
25
-
26
- let {
27
- onSelect
28
- } = _ref;
29
- const {
30
- selectedNavigationBlockId,
31
- clientIdToRef,
32
- navigationMenus,
33
- isResolvingNavigationMenus,
34
- hasResolvedNavigationMenus,
35
- firstNavigationBlockId
36
- } = useSelect(select => {
37
- const {
38
- __experimentalGetActiveBlockIdByBlockNames,
39
- __experimentalGetGlobalBlocksByName,
40
- getBlock
41
- } = select(blockEditorStore);
42
- const {
43
- getEntityRecords,
44
- hasFinishedResolution,
45
- isResolving
46
- } = select(coreStore);
47
- const navigationMenusQuery = ['postType', 'wp_navigation', NAVIGATION_MENUS_QUERY[0]]; // Get the active Navigation block (if present).
48
-
49
- const selectedNavId = __experimentalGetActiveBlockIdByBlockNames('core/navigation'); // Get all Navigation blocks currently within the editor canvas.
50
-
51
-
52
- const navBlockIds = __experimentalGetGlobalBlocksByName('core/navigation');
53
-
54
- const idToRef = {};
55
- navBlockIds.forEach(id => {
56
- var _getBlock, _getBlock$attributes;
57
-
58
- idToRef[id] = (_getBlock = getBlock(id)) === null || _getBlock === void 0 ? void 0 : (_getBlock$attributes = _getBlock.attributes) === null || _getBlock$attributes === void 0 ? void 0 : _getBlock$attributes.ref;
59
- });
60
- return {
61
- selectedNavigationBlockId: selectedNavId,
62
- firstNavigationBlockId: navBlockIds === null || navBlockIds === void 0 ? void 0 : navBlockIds[0],
63
- clientIdToRef: idToRef,
64
- navigationMenus: getEntityRecords(...navigationMenusQuery),
65
- isResolvingNavigationMenus: isResolving('getEntityRecords', navigationMenusQuery),
66
- hasResolvedNavigationMenus: hasFinishedResolution('getEntityRecords', navigationMenusQuery)
67
- };
68
- }, []);
69
- const navMenuListId = useInstanceId(NavigationMenu, 'edit-site-navigation-inspector-menu');
70
- const firstNavRefInTemplate = clientIdToRef[firstNavigationBlockId];
71
- const firstNavigationMenuRef = navigationMenus === null || navigationMenus === void 0 ? void 0 : (_navigationMenus$ = navigationMenus[0]) === null || _navigationMenus$ === void 0 ? void 0 : _navigationMenus$.id; // Default Navigation Menu is either:
72
- // - the Navigation Menu referenced by the first Nav block within the template.
73
- // - the first of the available Navigation Menus (`wp_navigation`) posts.
74
-
75
- const defaultNavigationMenuId = firstNavRefInTemplate || firstNavigationMenuRef; // The Navigation Menu manually selected by the user within the Nav inspector.
76
-
77
- const [currentMenuId, setCurrentMenuId] = useState(firstNavRefInTemplate); // If a Nav block is selected within the canvas then set the
78
- // Navigation Menu referenced by it's `ref` attribute to be
79
- // active within the Navigation sidebar.
80
-
81
- useEffect(() => {
82
- if (selectedNavigationBlockId) {
83
- setCurrentMenuId(clientIdToRef[selectedNavigationBlockId]);
84
- }
85
- }, [selectedNavigationBlockId]);
86
- let options = [];
87
-
88
- if (navigationMenus) {
89
- options = navigationMenus.map(_ref2 => {
90
- let {
91
- id,
92
- title
93
- } = _ref2;
94
- return {
95
- value: id,
96
- label: title.rendered
97
- };
98
- });
99
- }
100
-
101
- const [innerBlocks, onInput, onChange] = useEntityBlockEditor('postType', 'wp_navigation', {
102
- id: currentMenuId || defaultNavigationMenuId
103
- });
104
- const {
105
- isLoadingInnerBlocks,
106
- hasLoadedInnerBlocks
107
- } = useSelect(select => {
108
- const {
109
- isResolving,
110
- hasFinishedResolution
111
- } = select(coreStore);
112
- return {
113
- isLoadingInnerBlocks: isResolving('getEntityRecord', ['postType', 'wp_navigation', currentMenuId || defaultNavigationMenuId]),
114
- hasLoadedInnerBlocks: hasFinishedResolution('getEntityRecord', ['postType', 'wp_navigation', currentMenuId || defaultNavigationMenuId])
115
- };
116
- }, [currentMenuId, defaultNavigationMenuId]);
117
- const isLoading = !(hasResolvedNavigationMenus && hasLoadedInnerBlocks);
118
- const hasMoreThanOneNavigationMenu = (navigationMenus === null || navigationMenus === void 0 ? void 0 : navigationMenus.length) > 1;
119
- const hasNavigationMenus = !!(navigationMenus !== null && navigationMenus !== void 0 && navigationMenus.length); // Entity block editor will return entities that are not currently published.
120
- // Guard by only allowing their usage if there are published Nav Menus.
121
-
122
- const publishedInnerBlocks = hasNavigationMenus ? innerBlocks : [];
123
- const hasInnerBlocks = !!(publishedInnerBlocks !== null && publishedInnerBlocks !== void 0 && publishedInnerBlocks.length);
124
- useEffect(() => {
125
- if (isResolvingNavigationMenus) {
126
- speak('Loading Navigation sidebar menus.');
127
- }
128
-
129
- if (hasResolvedNavigationMenus) {
130
- speak('Navigation sidebar menus have loaded.');
131
- }
132
- }, [isResolvingNavigationMenus, hasResolvedNavigationMenus]);
133
- useEffect(() => {
134
- if (isLoadingInnerBlocks) {
135
- speak('Loading Navigation sidebar selected menu items.');
136
- }
137
-
138
- if (hasLoadedInnerBlocks) {
139
- speak('Navigation sidebar selected menu items have loaded.');
140
- }
141
- }, [isLoadingInnerBlocks, hasLoadedInnerBlocks]);
142
- return createElement("div", {
143
- className: "edit-site-navigation-inspector"
144
- }, hasResolvedNavigationMenus && !hasNavigationMenus && createElement("p", {
145
- className: "edit-site-navigation-inspector__empty-msg"
146
- }, __('There are no Navigation Menus.')), !hasResolvedNavigationMenus && createElement("div", {
147
- className: "edit-site-navigation-inspector__placeholder"
148
- }), hasResolvedNavigationMenus && hasMoreThanOneNavigationMenu && createElement(SelectControl, {
149
- __nextHasNoMarginBottom: true,
150
- className: "edit-site-navigation-inspector__select-menu",
151
- "aria-controls": // aria-controls should only apply when referenced element is in DOM
152
- hasLoadedInnerBlocks ? navMenuListId : undefined,
153
- value: currentMenuId || defaultNavigationMenuId,
154
- options: options,
155
- onChange: newMenuId => setCurrentMenuId(Number(newMenuId))
156
- }), isLoading && createElement(Fragment, null, createElement("div", {
157
- className: "edit-site-navigation-inspector__placeholder is-child"
158
- }), createElement("div", {
159
- className: "edit-site-navigation-inspector__placeholder is-child"
160
- }), createElement("div", {
161
- className: "edit-site-navigation-inspector__placeholder is-child"
162
- })), hasInnerBlocks && !isLoading && createElement(BlockEditorProvider, {
163
- value: publishedInnerBlocks,
164
- onChange: onChange,
165
- onInput: onInput
166
- }, createElement(NavigationMenu, {
167
- innerBlocks: publishedInnerBlocks,
168
- onSelect: onSelect
169
- })), !hasInnerBlocks && !isLoading && createElement("p", {
170
- className: "edit-site-navigation-inspector__empty-msg"
171
- }, __('Navigation Menu is empty.')));
172
- }
173
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["@wordpress/edit-site/src/components/navigation-inspector/index.js"],"names":["useSelect","useState","useEffect","SelectControl","store","coreStore","useEntityBlockEditor","blockEditorStore","BlockEditorProvider","speak","useInstanceId","__","NavigationMenu","NAVIGATION_MENUS_QUERY","per_page","status","NavigationInspector","onSelect","selectedNavigationBlockId","clientIdToRef","navigationMenus","isResolvingNavigationMenus","hasResolvedNavigationMenus","firstNavigationBlockId","select","__experimentalGetActiveBlockIdByBlockNames","__experimentalGetGlobalBlocksByName","getBlock","getEntityRecords","hasFinishedResolution","isResolving","navigationMenusQuery","selectedNavId","navBlockIds","idToRef","forEach","id","attributes","ref","navMenuListId","firstNavRefInTemplate","firstNavigationMenuRef","defaultNavigationMenuId","currentMenuId","setCurrentMenuId","options","map","title","value","label","rendered","innerBlocks","onInput","onChange","isLoadingInnerBlocks","hasLoadedInnerBlocks","isLoading","hasMoreThanOneNavigationMenu","length","hasNavigationMenus","publishedInnerBlocks","hasInnerBlocks","undefined","newMenuId","Number"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useState, useEffect } from '@wordpress/element';\nimport { SelectControl } from '@wordpress/components';\nimport { store as coreStore, useEntityBlockEditor } from '@wordpress/core-data';\nimport {\n\tstore as blockEditorStore,\n\tBlockEditorProvider,\n} from '@wordpress/block-editor';\nimport { speak } from '@wordpress/a11y';\nimport { useInstanceId } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport NavigationMenu from './navigation-menu';\n\nconst NAVIGATION_MENUS_QUERY = [ { per_page: -1, status: 'publish' } ];\n\nexport default function NavigationInspector( { onSelect } ) {\n\tconst {\n\t\tselectedNavigationBlockId,\n\t\tclientIdToRef,\n\t\tnavigationMenus,\n\t\tisResolvingNavigationMenus,\n\t\thasResolvedNavigationMenus,\n\t\tfirstNavigationBlockId,\n\t} = useSelect( ( select ) => {\n\t\tconst {\n\t\t\t__experimentalGetActiveBlockIdByBlockNames,\n\t\t\t__experimentalGetGlobalBlocksByName,\n\t\t\tgetBlock,\n\t\t} = select( blockEditorStore );\n\n\t\tconst { getEntityRecords, hasFinishedResolution, isResolving } =\n\t\t\tselect( coreStore );\n\n\t\tconst navigationMenusQuery = [\n\t\t\t'postType',\n\t\t\t'wp_navigation',\n\t\t\tNAVIGATION_MENUS_QUERY[ 0 ],\n\t\t];\n\n\t\t// Get the active Navigation block (if present).\n\t\tconst selectedNavId =\n\t\t\t__experimentalGetActiveBlockIdByBlockNames( 'core/navigation' );\n\n\t\t// Get all Navigation blocks currently within the editor canvas.\n\t\tconst navBlockIds =\n\t\t\t__experimentalGetGlobalBlocksByName( 'core/navigation' );\n\t\tconst idToRef = {};\n\t\tnavBlockIds.forEach( ( id ) => {\n\t\t\tidToRef[ id ] = getBlock( id )?.attributes?.ref;\n\t\t} );\n\t\treturn {\n\t\t\tselectedNavigationBlockId: selectedNavId,\n\t\t\tfirstNavigationBlockId: navBlockIds?.[ 0 ],\n\t\t\tclientIdToRef: idToRef,\n\t\t\tnavigationMenus: getEntityRecords( ...navigationMenusQuery ),\n\t\t\tisResolvingNavigationMenus: isResolving(\n\t\t\t\t'getEntityRecords',\n\t\t\t\tnavigationMenusQuery\n\t\t\t),\n\t\t\thasResolvedNavigationMenus: hasFinishedResolution(\n\t\t\t\t'getEntityRecords',\n\t\t\t\tnavigationMenusQuery\n\t\t\t),\n\t\t};\n\t}, [] );\n\n\tconst navMenuListId = useInstanceId(\n\t\tNavigationMenu,\n\t\t'edit-site-navigation-inspector-menu'\n\t);\n\n\tconst firstNavRefInTemplate = clientIdToRef[ firstNavigationBlockId ];\n\tconst firstNavigationMenuRef = navigationMenus?.[ 0 ]?.id;\n\n\t// Default Navigation Menu is either:\n\t// - the Navigation Menu referenced by the first Nav block within the template.\n\t// - the first of the available Navigation Menus (`wp_navigation`) posts.\n\tconst defaultNavigationMenuId =\n\t\tfirstNavRefInTemplate || firstNavigationMenuRef;\n\n\t// The Navigation Menu manually selected by the user within the Nav inspector.\n\tconst [ currentMenuId, setCurrentMenuId ] = useState(\n\t\tfirstNavRefInTemplate\n\t);\n\n\t// If a Nav block is selected within the canvas then set the\n\t// Navigation Menu referenced by it's `ref` attribute to be\n\t// active within the Navigation sidebar.\n\tuseEffect( () => {\n\t\tif ( selectedNavigationBlockId ) {\n\t\t\tsetCurrentMenuId( clientIdToRef[ selectedNavigationBlockId ] );\n\t\t}\n\t}, [ selectedNavigationBlockId ] );\n\n\tlet options = [];\n\tif ( navigationMenus ) {\n\t\toptions = navigationMenus.map( ( { id, title } ) => ( {\n\t\t\tvalue: id,\n\t\t\tlabel: title.rendered,\n\t\t} ) );\n\t}\n\n\tconst [ innerBlocks, onInput, onChange ] = useEntityBlockEditor(\n\t\t'postType',\n\t\t'wp_navigation',\n\t\t{ id: currentMenuId || defaultNavigationMenuId }\n\t);\n\n\tconst { isLoadingInnerBlocks, hasLoadedInnerBlocks } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { isResolving, hasFinishedResolution } = select( coreStore );\n\t\t\treturn {\n\t\t\t\tisLoadingInnerBlocks: isResolving( 'getEntityRecord', [\n\t\t\t\t\t'postType',\n\t\t\t\t\t'wp_navigation',\n\t\t\t\t\tcurrentMenuId || defaultNavigationMenuId,\n\t\t\t\t] ),\n\t\t\t\thasLoadedInnerBlocks: hasFinishedResolution(\n\t\t\t\t\t'getEntityRecord',\n\t\t\t\t\t[\n\t\t\t\t\t\t'postType',\n\t\t\t\t\t\t'wp_navigation',\n\t\t\t\t\t\tcurrentMenuId || defaultNavigationMenuId,\n\t\t\t\t\t]\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[ currentMenuId, defaultNavigationMenuId ]\n\t);\n\n\tconst isLoading = ! ( hasResolvedNavigationMenus && hasLoadedInnerBlocks );\n\n\tconst hasMoreThanOneNavigationMenu = navigationMenus?.length > 1;\n\n\tconst hasNavigationMenus = !! navigationMenus?.length;\n\n\t// Entity block editor will return entities that are not currently published.\n\t// Guard by only allowing their usage if there are published Nav Menus.\n\tconst publishedInnerBlocks = hasNavigationMenus ? innerBlocks : [];\n\n\tconst hasInnerBlocks = !! publishedInnerBlocks?.length;\n\n\tuseEffect( () => {\n\t\tif ( isResolvingNavigationMenus ) {\n\t\t\tspeak( 'Loading Navigation sidebar menus.' );\n\t\t}\n\n\t\tif ( hasResolvedNavigationMenus ) {\n\t\t\tspeak( 'Navigation sidebar menus have loaded.' );\n\t\t}\n\t}, [ isResolvingNavigationMenus, hasResolvedNavigationMenus ] );\n\n\tuseEffect( () => {\n\t\tif ( isLoadingInnerBlocks ) {\n\t\t\tspeak( 'Loading Navigation sidebar selected menu items.' );\n\t\t}\n\n\t\tif ( hasLoadedInnerBlocks ) {\n\t\t\tspeak( 'Navigation sidebar selected menu items have loaded.' );\n\t\t}\n\t}, [ isLoadingInnerBlocks, hasLoadedInnerBlocks ] );\n\n\treturn (\n\t\t<div className=\"edit-site-navigation-inspector\">\n\t\t\t{ hasResolvedNavigationMenus && ! hasNavigationMenus && (\n\t\t\t\t<p className=\"edit-site-navigation-inspector__empty-msg\">\n\t\t\t\t\t{ __( 'There are no Navigation Menus.' ) }\n\t\t\t\t</p>\n\t\t\t) }\n\n\t\t\t{ ! hasResolvedNavigationMenus && (\n\t\t\t\t<div className=\"edit-site-navigation-inspector__placeholder\" />\n\t\t\t) }\n\t\t\t{ hasResolvedNavigationMenus && hasMoreThanOneNavigationMenu && (\n\t\t\t\t<SelectControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tclassName=\"edit-site-navigation-inspector__select-menu\"\n\t\t\t\t\taria-controls={\n\t\t\t\t\t\t// aria-controls should only apply when referenced element is in DOM\n\t\t\t\t\t\thasLoadedInnerBlocks ? navMenuListId : undefined\n\t\t\t\t\t}\n\t\t\t\t\tvalue={ currentMenuId || defaultNavigationMenuId }\n\t\t\t\t\toptions={ options }\n\t\t\t\t\tonChange={ ( newMenuId ) =>\n\t\t\t\t\t\tsetCurrentMenuId( Number( newMenuId ) )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ isLoading && (\n\t\t\t\t<>\n\t\t\t\t\t<div className=\"edit-site-navigation-inspector__placeholder is-child\" />\n\t\t\t\t\t<div className=\"edit-site-navigation-inspector__placeholder is-child\" />\n\t\t\t\t\t<div className=\"edit-site-navigation-inspector__placeholder is-child\" />\n\t\t\t\t</>\n\t\t\t) }\n\t\t\t{ hasInnerBlocks && ! isLoading && (\n\t\t\t\t<BlockEditorProvider\n\t\t\t\t\tvalue={ publishedInnerBlocks }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tonInput={ onInput }\n\t\t\t\t>\n\t\t\t\t\t<NavigationMenu\n\t\t\t\t\t\tinnerBlocks={ publishedInnerBlocks }\n\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t/>\n\t\t\t\t</BlockEditorProvider>\n\t\t\t) }\n\n\t\t\t{ ! hasInnerBlocks && ! isLoading && (\n\t\t\t\t<p className=\"edit-site-navigation-inspector__empty-msg\">\n\t\t\t\t\t{ __( 'Navigation Menu is empty.' ) }\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"]}
@@ -1,52 +0,0 @@
1
- import { createElement } from "@wordpress/element";
2
-
3
- /**
4
- * WordPress dependencies
5
- */
6
- import { privateApis as blockEditorPrivateApis, store as blockEditorStore } from '@wordpress/block-editor';
7
- import { useEffect } from '@wordpress/element';
8
- import { useDispatch } from '@wordpress/data';
9
- /**
10
- * Internal dependencies
11
- */
12
-
13
- import { unlock } from '../../private-apis';
14
- const ALLOWED_BLOCKS = {
15
- 'core/navigation': ['core/navigation-link', 'core/search', 'core/social-links', 'core/page-list', 'core/spacer', 'core/home-link', 'core/site-title', 'core/site-logo', 'core/navigation-submenu'],
16
- 'core/social-links': ['core/social-link'],
17
- 'core/navigation-submenu': ['core/navigation-link', 'core/navigation-submenu'],
18
- 'core/navigation-link': ['core/navigation-link', 'core/navigation-submenu']
19
- };
20
- export default function NavigationMenu(_ref) {
21
- let {
22
- innerBlocks,
23
- onSelect
24
- } = _ref;
25
- const {
26
- updateBlockListSettings
27
- } = useDispatch(blockEditorStore);
28
- const {
29
- OffCanvasEditor,
30
- LeafMoreMenu
31
- } = unlock(blockEditorPrivateApis); //TODO: Block settings are normally updated as a side effect of rendering InnerBlocks in BlockList
32
- //Think through a better way of doing this, possible with adding allowed blocks to block library metadata
33
-
34
- useEffect(() => {
35
- updateBlockListSettings('', {
36
- allowedBlocks: ALLOWED_BLOCKS['core/navigation']
37
- });
38
- innerBlocks.forEach(block => {
39
- if (ALLOWED_BLOCKS[block.name]) {
40
- updateBlockListSettings(block.clientId, {
41
- allowedBlocks: ALLOWED_BLOCKS[block.name]
42
- });
43
- }
44
- });
45
- }, [updateBlockListSettings, innerBlocks]);
46
- return createElement(OffCanvasEditor, {
47
- blocks: innerBlocks,
48
- onSelect: onSelect,
49
- LeafMoreMenu: LeafMoreMenu
50
- });
51
- }
52
- //# sourceMappingURL=navigation-menu.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["@wordpress/edit-site/src/components/navigation-inspector/navigation-menu.js"],"names":["privateApis","blockEditorPrivateApis","store","blockEditorStore","useEffect","useDispatch","unlock","ALLOWED_BLOCKS","NavigationMenu","innerBlocks","onSelect","updateBlockListSettings","OffCanvasEditor","LeafMoreMenu","allowedBlocks","forEach","block","name","clientId"],"mappings":";;AAAA;AACA;AACA;AACA,SACCA,WAAW,IAAIC,sBADhB,EAECC,KAAK,IAAIC,gBAFV,QAGO,yBAHP;AAIA,SAASC,SAAT,QAA0B,oBAA1B;AACA,SAASC,WAAT,QAA4B,iBAA5B;AAEA;AACA;AACA;;AACA,SAASC,MAAT,QAAuB,oBAAvB;AAEA,MAAMC,cAAc,GAAG;AACtB,qBAAmB,CAClB,sBADkB,EAElB,aAFkB,EAGlB,mBAHkB,EAIlB,gBAJkB,EAKlB,aALkB,EAMlB,gBANkB,EAOlB,iBAPkB,EAQlB,gBARkB,EASlB,yBATkB,CADG;AAYtB,uBAAqB,CAAE,kBAAF,CAZC;AAatB,6BAA2B,CAC1B,sBAD0B,EAE1B,yBAF0B,CAbL;AAiBtB,0BAAwB,CACvB,sBADuB,EAEvB,yBAFuB;AAjBF,CAAvB;AAuBA,eAAe,SAASC,cAAT,OAAqD;AAAA,MAA5B;AAAEC,IAAAA,WAAF;AAAeC,IAAAA;AAAf,GAA4B;AACnE,QAAM;AAAEC,IAAAA;AAAF,MAA8BN,WAAW,CAAEF,gBAAF,CAA/C;AAEA,QAAM;AAAES,IAAAA,eAAF;AAAmBC,IAAAA;AAAnB,MAAoCP,MAAM,CAAEL,sBAAF,CAAhD,CAHmE,CAKnE;AACA;;AACAG,EAAAA,SAAS,CAAE,MAAM;AAChBO,IAAAA,uBAAuB,CAAE,EAAF,EAAM;AAC5BG,MAAAA,aAAa,EAAEP,cAAc,CAAE,iBAAF;AADD,KAAN,CAAvB;AAGAE,IAAAA,WAAW,CAACM,OAAZ,CAAuBC,KAAF,IAAa;AACjC,UAAKT,cAAc,CAAES,KAAK,CAACC,IAAR,CAAnB,EAAoC;AACnCN,QAAAA,uBAAuB,CAAEK,KAAK,CAACE,QAAR,EAAkB;AACxCJ,UAAAA,aAAa,EAAEP,cAAc,CAAES,KAAK,CAACC,IAAR;AADW,SAAlB,CAAvB;AAGA;AACD,KAND;AAOA,GAXQ,EAWN,CAAEN,uBAAF,EAA2BF,WAA3B,CAXM,CAAT;AAaA,SACC,cAAC,eAAD;AACC,IAAA,MAAM,EAAGA,WADV;AAEC,IAAA,QAAQ,EAAGC,QAFZ;AAGC,IAAA,YAAY,EAAGG;AAHhB,IADD;AAOA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { useEffect } from '@wordpress/element';\nimport { useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../private-apis';\n\nconst ALLOWED_BLOCKS = {\n\t'core/navigation': [\n\t\t'core/navigation-link',\n\t\t'core/search',\n\t\t'core/social-links',\n\t\t'core/page-list',\n\t\t'core/spacer',\n\t\t'core/home-link',\n\t\t'core/site-title',\n\t\t'core/site-logo',\n\t\t'core/navigation-submenu',\n\t],\n\t'core/social-links': [ 'core/social-link' ],\n\t'core/navigation-submenu': [\n\t\t'core/navigation-link',\n\t\t'core/navigation-submenu',\n\t],\n\t'core/navigation-link': [\n\t\t'core/navigation-link',\n\t\t'core/navigation-submenu',\n\t],\n};\n\nexport default function NavigationMenu( { innerBlocks, onSelect } ) {\n\tconst { updateBlockListSettings } = useDispatch( blockEditorStore );\n\n\tconst { OffCanvasEditor, LeafMoreMenu } = unlock( blockEditorPrivateApis );\n\n\t//TODO: Block settings are normally updated as a side effect of rendering InnerBlocks in BlockList\n\t//Think through a better way of doing this, possible with adding allowed blocks to block library metadata\n\tuseEffect( () => {\n\t\tupdateBlockListSettings( '', {\n\t\t\tallowedBlocks: ALLOWED_BLOCKS[ 'core/navigation' ],\n\t\t} );\n\t\tinnerBlocks.forEach( ( block ) => {\n\t\t\tif ( ALLOWED_BLOCKS[ block.name ] ) {\n\t\t\t\tupdateBlockListSettings( block.clientId, {\n\t\t\t\t\tallowedBlocks: ALLOWED_BLOCKS[ block.name ],\n\t\t\t\t} );\n\t\t\t}\n\t\t} );\n\t}, [ updateBlockListSettings, innerBlocks ] );\n\n\treturn (\n\t\t<OffCanvasEditor\n\t\t\tblocks={ innerBlocks }\n\t\t\tonSelect={ onSelect }\n\t\t\tLeafMoreMenu={ LeafMoreMenu }\n\t\t/>\n\t);\n}\n"]}
@@ -1,223 +0,0 @@
1
- /**
2
- * WordPress dependencies
3
- */
4
- import { useSelect } from '@wordpress/data';
5
- import { useState, useEffect } from '@wordpress/element';
6
- import { SelectControl } from '@wordpress/components';
7
- import { store as coreStore, useEntityBlockEditor } from '@wordpress/core-data';
8
- import {
9
- store as blockEditorStore,
10
- BlockEditorProvider,
11
- } from '@wordpress/block-editor';
12
- import { speak } from '@wordpress/a11y';
13
- import { useInstanceId } from '@wordpress/compose';
14
- import { __ } from '@wordpress/i18n';
15
-
16
- /**
17
- * Internal dependencies
18
- */
19
- import NavigationMenu from './navigation-menu';
20
-
21
- const NAVIGATION_MENUS_QUERY = [ { per_page: -1, status: 'publish' } ];
22
-
23
- export default function NavigationInspector( { onSelect } ) {
24
- const {
25
- selectedNavigationBlockId,
26
- clientIdToRef,
27
- navigationMenus,
28
- isResolvingNavigationMenus,
29
- hasResolvedNavigationMenus,
30
- firstNavigationBlockId,
31
- } = useSelect( ( select ) => {
32
- const {
33
- __experimentalGetActiveBlockIdByBlockNames,
34
- __experimentalGetGlobalBlocksByName,
35
- getBlock,
36
- } = select( blockEditorStore );
37
-
38
- const { getEntityRecords, hasFinishedResolution, isResolving } =
39
- select( coreStore );
40
-
41
- const navigationMenusQuery = [
42
- 'postType',
43
- 'wp_navigation',
44
- NAVIGATION_MENUS_QUERY[ 0 ],
45
- ];
46
-
47
- // Get the active Navigation block (if present).
48
- const selectedNavId =
49
- __experimentalGetActiveBlockIdByBlockNames( 'core/navigation' );
50
-
51
- // Get all Navigation blocks currently within the editor canvas.
52
- const navBlockIds =
53
- __experimentalGetGlobalBlocksByName( 'core/navigation' );
54
- const idToRef = {};
55
- navBlockIds.forEach( ( id ) => {
56
- idToRef[ id ] = getBlock( id )?.attributes?.ref;
57
- } );
58
- return {
59
- selectedNavigationBlockId: selectedNavId,
60
- firstNavigationBlockId: navBlockIds?.[ 0 ],
61
- clientIdToRef: idToRef,
62
- navigationMenus: getEntityRecords( ...navigationMenusQuery ),
63
- isResolvingNavigationMenus: isResolving(
64
- 'getEntityRecords',
65
- navigationMenusQuery
66
- ),
67
- hasResolvedNavigationMenus: hasFinishedResolution(
68
- 'getEntityRecords',
69
- navigationMenusQuery
70
- ),
71
- };
72
- }, [] );
73
-
74
- const navMenuListId = useInstanceId(
75
- NavigationMenu,
76
- 'edit-site-navigation-inspector-menu'
77
- );
78
-
79
- const firstNavRefInTemplate = clientIdToRef[ firstNavigationBlockId ];
80
- const firstNavigationMenuRef = navigationMenus?.[ 0 ]?.id;
81
-
82
- // Default Navigation Menu is either:
83
- // - the Navigation Menu referenced by the first Nav block within the template.
84
- // - the first of the available Navigation Menus (`wp_navigation`) posts.
85
- const defaultNavigationMenuId =
86
- firstNavRefInTemplate || firstNavigationMenuRef;
87
-
88
- // The Navigation Menu manually selected by the user within the Nav inspector.
89
- const [ currentMenuId, setCurrentMenuId ] = useState(
90
- firstNavRefInTemplate
91
- );
92
-
93
- // If a Nav block is selected within the canvas then set the
94
- // Navigation Menu referenced by it's `ref` attribute to be
95
- // active within the Navigation sidebar.
96
- useEffect( () => {
97
- if ( selectedNavigationBlockId ) {
98
- setCurrentMenuId( clientIdToRef[ selectedNavigationBlockId ] );
99
- }
100
- }, [ selectedNavigationBlockId ] );
101
-
102
- let options = [];
103
- if ( navigationMenus ) {
104
- options = navigationMenus.map( ( { id, title } ) => ( {
105
- value: id,
106
- label: title.rendered,
107
- } ) );
108
- }
109
-
110
- const [ innerBlocks, onInput, onChange ] = useEntityBlockEditor(
111
- 'postType',
112
- 'wp_navigation',
113
- { id: currentMenuId || defaultNavigationMenuId }
114
- );
115
-
116
- const { isLoadingInnerBlocks, hasLoadedInnerBlocks } = useSelect(
117
- ( select ) => {
118
- const { isResolving, hasFinishedResolution } = select( coreStore );
119
- return {
120
- isLoadingInnerBlocks: isResolving( 'getEntityRecord', [
121
- 'postType',
122
- 'wp_navigation',
123
- currentMenuId || defaultNavigationMenuId,
124
- ] ),
125
- hasLoadedInnerBlocks: hasFinishedResolution(
126
- 'getEntityRecord',
127
- [
128
- 'postType',
129
- 'wp_navigation',
130
- currentMenuId || defaultNavigationMenuId,
131
- ]
132
- ),
133
- };
134
- },
135
- [ currentMenuId, defaultNavigationMenuId ]
136
- );
137
-
138
- const isLoading = ! ( hasResolvedNavigationMenus && hasLoadedInnerBlocks );
139
-
140
- const hasMoreThanOneNavigationMenu = navigationMenus?.length > 1;
141
-
142
- const hasNavigationMenus = !! navigationMenus?.length;
143
-
144
- // Entity block editor will return entities that are not currently published.
145
- // Guard by only allowing their usage if there are published Nav Menus.
146
- const publishedInnerBlocks = hasNavigationMenus ? innerBlocks : [];
147
-
148
- const hasInnerBlocks = !! publishedInnerBlocks?.length;
149
-
150
- useEffect( () => {
151
- if ( isResolvingNavigationMenus ) {
152
- speak( 'Loading Navigation sidebar menus.' );
153
- }
154
-
155
- if ( hasResolvedNavigationMenus ) {
156
- speak( 'Navigation sidebar menus have loaded.' );
157
- }
158
- }, [ isResolvingNavigationMenus, hasResolvedNavigationMenus ] );
159
-
160
- useEffect( () => {
161
- if ( isLoadingInnerBlocks ) {
162
- speak( 'Loading Navigation sidebar selected menu items.' );
163
- }
164
-
165
- if ( hasLoadedInnerBlocks ) {
166
- speak( 'Navigation sidebar selected menu items have loaded.' );
167
- }
168
- }, [ isLoadingInnerBlocks, hasLoadedInnerBlocks ] );
169
-
170
- return (
171
- <div className="edit-site-navigation-inspector">
172
- { hasResolvedNavigationMenus && ! hasNavigationMenus && (
173
- <p className="edit-site-navigation-inspector__empty-msg">
174
- { __( 'There are no Navigation Menus.' ) }
175
- </p>
176
- ) }
177
-
178
- { ! hasResolvedNavigationMenus && (
179
- <div className="edit-site-navigation-inspector__placeholder" />
180
- ) }
181
- { hasResolvedNavigationMenus && hasMoreThanOneNavigationMenu && (
182
- <SelectControl
183
- __nextHasNoMarginBottom
184
- className="edit-site-navigation-inspector__select-menu"
185
- aria-controls={
186
- // aria-controls should only apply when referenced element is in DOM
187
- hasLoadedInnerBlocks ? navMenuListId : undefined
188
- }
189
- value={ currentMenuId || defaultNavigationMenuId }
190
- options={ options }
191
- onChange={ ( newMenuId ) =>
192
- setCurrentMenuId( Number( newMenuId ) )
193
- }
194
- />
195
- ) }
196
- { isLoading && (
197
- <>
198
- <div className="edit-site-navigation-inspector__placeholder is-child" />
199
- <div className="edit-site-navigation-inspector__placeholder is-child" />
200
- <div className="edit-site-navigation-inspector__placeholder is-child" />
201
- </>
202
- ) }
203
- { hasInnerBlocks && ! isLoading && (
204
- <BlockEditorProvider
205
- value={ publishedInnerBlocks }
206
- onChange={ onChange }
207
- onInput={ onInput }
208
- >
209
- <NavigationMenu
210
- innerBlocks={ publishedInnerBlocks }
211
- onSelect={ onSelect }
212
- />
213
- </BlockEditorProvider>
214
- ) }
215
-
216
- { ! hasInnerBlocks && ! isLoading && (
217
- <p className="edit-site-navigation-inspector__empty-msg">
218
- { __( 'Navigation Menu is empty.' ) }
219
- </p>
220
- ) }
221
- </div>
222
- );
223
- }
@@ -1,66 +0,0 @@
1
- /**
2
- * WordPress dependencies
3
- */
4
- import {
5
- privateApis as blockEditorPrivateApis,
6
- store as blockEditorStore,
7
- } from '@wordpress/block-editor';
8
- import { useEffect } from '@wordpress/element';
9
- import { useDispatch } from '@wordpress/data';
10
-
11
- /**
12
- * Internal dependencies
13
- */
14
- import { unlock } from '../../private-apis';
15
-
16
- const ALLOWED_BLOCKS = {
17
- 'core/navigation': [
18
- 'core/navigation-link',
19
- 'core/search',
20
- 'core/social-links',
21
- 'core/page-list',
22
- 'core/spacer',
23
- 'core/home-link',
24
- 'core/site-title',
25
- 'core/site-logo',
26
- 'core/navigation-submenu',
27
- ],
28
- 'core/social-links': [ 'core/social-link' ],
29
- 'core/navigation-submenu': [
30
- 'core/navigation-link',
31
- 'core/navigation-submenu',
32
- ],
33
- 'core/navigation-link': [
34
- 'core/navigation-link',
35
- 'core/navigation-submenu',
36
- ],
37
- };
38
-
39
- export default function NavigationMenu( { innerBlocks, onSelect } ) {
40
- const { updateBlockListSettings } = useDispatch( blockEditorStore );
41
-
42
- const { OffCanvasEditor, LeafMoreMenu } = unlock( blockEditorPrivateApis );
43
-
44
- //TODO: Block settings are normally updated as a side effect of rendering InnerBlocks in BlockList
45
- //Think through a better way of doing this, possible with adding allowed blocks to block library metadata
46
- useEffect( () => {
47
- updateBlockListSettings( '', {
48
- allowedBlocks: ALLOWED_BLOCKS[ 'core/navigation' ],
49
- } );
50
- innerBlocks.forEach( ( block ) => {
51
- if ( ALLOWED_BLOCKS[ block.name ] ) {
52
- updateBlockListSettings( block.clientId, {
53
- allowedBlocks: ALLOWED_BLOCKS[ block.name ],
54
- } );
55
- }
56
- } );
57
- }, [ updateBlockListSettings, innerBlocks ] );
58
-
59
- return (
60
- <OffCanvasEditor
61
- blocks={ innerBlocks }
62
- onSelect={ onSelect }
63
- LeafMoreMenu={ LeafMoreMenu }
64
- />
65
- );
66
- }
@@ -1,46 +0,0 @@
1
- @keyframes loadingpulse {
2
- 0% {
3
- opacity: 1;
4
- }
5
- 50% {
6
- opacity: 0.5;
7
- }
8
- 100% {
9
- opacity: 1;
10
- }
11
- }
12
-
13
- .edit-site-navigation-inspector {
14
- .block-editor-list-view-leaf .block-editor-list-view-block-contents {
15
- white-space: normal;
16
- }
17
-
18
- .block-editor-list-view-block__title {
19
- margin-top: 3px;
20
- }
21
-
22
- .block-editor-list-view-block__menu-cell {
23
- padding-right: 0;
24
- }
25
-
26
- .edit-site-navigation-inspector__select-menu {
27
- margin-bottom: $grid-unit-10;
28
- }
29
- }
30
-
31
- .edit-site-navigation-inspector__placeholder {
32
- padding: $grid-unit-10;
33
- margin: $grid-unit-10;
34
- background-color: $gray-100;
35
- animation: loadingpulse 1s linear infinite;
36
- animation-delay: 0.5s; // avoid animating for fast network responses
37
-
38
- &.is-child {
39
- margin-left: $grid-unit-30;
40
- width: 50%;
41
- }
42
- }
43
-
44
- .edit-site-navigation-inspector__empty-msg {
45
- padding: 0 $grid-unit-10;
46
- }