Components: Extract TableOfContents as reusable component

WordPress · Nov 24, 2017 · b81cdf6 · b81cdf6
1 parent 7b19f4f
commit b81cdf6
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 15 deletions.
diff --git a/editor/components/index.js b/editor/components/index.js
@@ -31,6 +31,7 @@ export { default as PostTitle } from './post-title';
 export { default as PostTrash } from './post-trash';
 export { default as PostVisibility } from './post-visibility';
 export { default as PostVisibilityLabel } from './post-visibility/label';
+export { default as TableOfContents } from './table-of-contents';
 export { default as UnsavedChangesWarning } from './unsaved-changes-warning';
 export { default as WordCount } from './word-count';
 

diff --git a/editor/edit-post/table-of-contents/index.js → editor/components/table-of-contents/index.js b/editor/edit-post/table-of-contents/index.js → editor/components/table-of-contents/index.js
@@ -14,7 +14,8 @@ import { Dropdown, IconButton } from '@wordpress/components';
  * Internal dependencies
  */
 import './style.scss';
-import { WordCount, DocumentOutline } from '../../components';
+import WordCount from '../word-count';
+import DocumentOutline from '../document-outline';
 import { getBlocks } from '../../selectors';
 import { selectBlock } from '../../actions';
 

diff --git a/...or/edit-post/table-of-contents/style.scss → ...r/components/table-of-contents/style.scss b/...or/edit-post/table-of-contents/style.scss → ...r/components/table-of-contents/style.scss
@@ -1,15 +1,3 @@
-.table-of-contents {
-	display: none;
-
-	.is-sidebar-opened & {
-		right: $sidebar-width + 16px;
-	}
-
-	@include break-small() {
-		display: block;
-	}
-}
-
 .table-of-contents__popover .components-popover__content {
 	padding: 16px;
 }

diff --git a/editor/edit-post/header/header-toolbar/index.js b/editor/edit-post/header/header-toolbar/index.js
@@ -13,10 +13,9 @@ import { IconButton } from '@wordpress/components';
  * Internal dependencies
  */
 import './style.scss';
-import { Inserter, BlockToolbar } from '../../../components';
+import { Inserter, BlockToolbar, TableOfContents } from '../../../components';
 import BlockSwitcher from '../../../components/block-switcher';
 import NavigableToolbar from '../../../components/navigable-toolbar';
-import TableOfContents from '../../table-of-contents';
 import { getMultiSelectedBlockUids, hasEditorUndo, hasEditorRedo, isFeatureActive } from '../../../selectors';
 
 function HeaderToolbar( { hasUndo, hasRedo, hasFixedToolbar, undo, redo, isMultiBlockSelection, selectedBlockUids } ) {

diff --git a/editor/edit-post/header/header-toolbar/style.scss b/editor/edit-post/header/header-toolbar/style.scss
@@ -52,3 +52,15 @@
 		}
 	}
 }
+
+.editor-header-toolbar .table-of-contents {
+	display: none;
+
+	.is-sidebar-opened & {
+		right: $sidebar-width + 16px;
+	}
+
+	@include break-small() {
+		display: block;
+	}
+}