This repository has been archived by the owner on Jun 12, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 11
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'layouts-main' into layout-batfish-helpers
* layouts-main: Add Changelog to catalog site 0.29.2 Prepare 0.29.2 Update devDependencies, create jest-setup.js (#311) Set peerDependencies to keep frontend libraries in sync (#292) Remove unused highlight.js and util function (#305) Add aria-label to BackToTopButton (#290)
- Loading branch information
Showing
19 changed files
with
7,058 additions
and
7,679 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,79 @@ | ||
| import React from 'react'; | ||
| import PropTypes from 'prop-types'; | ||
| import Topbar from '../../../src/components/topbar'; | ||
| import ProductMenu from '../../../src/components/product-menu'; | ||
| import PageLayout from '../../../src/components/page-layout'; | ||
| import Sidebar from '../components/sidebar'; | ||
| import Toc from '../components/toc'; | ||
| import TabList from '@mapbox/mr-ui/tab-list'; | ||
|
|
||
| class PageShell extends React.Component { | ||
| sidebarContent = () => { | ||
| const { title, headings } = this.props.frontMatter; | ||
|
|
||
| switch (title) { | ||
| case 'Overview': | ||
| return <Sidebar />; | ||
| default: | ||
| return <Toc headings={headings} />; | ||
| } | ||
| }; | ||
| render() { | ||
| const { children, location } = this.props; | ||
| const { pathname } = location; | ||
|
|
||
| return ( | ||
| <div> | ||
| <Topbar> | ||
| <div className="limiter"> | ||
| <div className="grid"> | ||
| <div className="col col--3-mm col--12"> | ||
| <div className="ml18-mm pt12"> | ||
| <ProductMenu productName="Dr. UI" homePage="/dr-ui/" /> | ||
| </div> | ||
| </div> | ||
| <div className="col col--5-mm col--12"> | ||
| <TabList | ||
| items={[ | ||
| { label: 'Components', id: '/dr-ui/', href: '/dr-ui/' }, | ||
| { | ||
| label: 'Changelog', | ||
| id: '/dr-ui/changelog/', | ||
| href: '/dr-ui/changelog/' | ||
| } | ||
| ]} | ||
| activeItem={pathname} | ||
| truncateBy={1} | ||
| /> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </Topbar> | ||
| <div className="limiter"> | ||
| <PageLayout | ||
| sideBarColSize={3} | ||
| sidebarContentStickyTop={0} | ||
| sidebarContentStickyTopNarrow={0} | ||
| sidebarContent={this.sidebarContent()} | ||
| > | ||
| <div className="prose">{children}</div> | ||
| </PageLayout> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| PageShell.propTypes = { | ||
| frontMatter: PropTypes.shape({ | ||
| title: PropTypes.string.isRequired, | ||
| description: PropTypes.string.isRequired, | ||
| contentType: PropTypes.string, | ||
| language: PropTypes.array, | ||
| level: PropTypes.number, | ||
| headings: PropTypes.array | ||
| }).isRequired, | ||
| children: PropTypes.node.isRequired | ||
| }; | ||
|
|
||
| export default PageShell; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,51 @@ | ||
| import React from 'react'; | ||
| import classnames from 'classnames'; | ||
| import Scrollspy from 'react-scrollspy'; | ||
| import PropTypes from 'prop-types'; | ||
|
|
||
| class LayoutToc extends React.PureComponent { | ||
| render() { | ||
| const sections = this.props.headings | ||
| .filter((heading) => { | ||
| return heading.level === 2 || heading.level === 3; | ||
| }) | ||
| .map((heading) => { | ||
| return { | ||
| title: heading.text, | ||
| url: `#${heading.slug}`, | ||
| level: heading.level | ||
| }; | ||
| }); | ||
|
|
||
| const items = sections.map((heading) => heading.url.replace('#', '')); | ||
| const tocContent = sections.map((heading, index) => { | ||
| const nextHeading = sections[index + 1] || null; | ||
| const headingClasses = classnames('', { | ||
| pb6: heading.level === 2, | ||
| 'mb6 color-gray': heading.level === 3, | ||
| mb24: nextHeading && nextHeading.level === 2 && heading.level === 3, | ||
| mb6: nextHeading && nextHeading.level === 2 && heading.level === 2 | ||
| }); | ||
| return ( | ||
| <li key={index} className={headingClasses}> | ||
| <a href={heading.url} className="color-blue-on-hover"> | ||
| {heading.title} | ||
| </a> | ||
| </li> | ||
| ); | ||
| }); | ||
| return ( | ||
| <div className="mx24"> | ||
| <Scrollspy items={items} currentClassName="txt-bold"> | ||
| {tocContent} | ||
| </Scrollspy> | ||
| </div> | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| LayoutToc.propTypes = { | ||
| headings: PropTypes.array.isRequired | ||
| }; | ||
|
|
||
| export default LayoutToc; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,44 @@ | ||
| import React from 'react'; | ||
| import { Helmet } from 'react-helmet'; | ||
|
|
||
| import PropTypes from 'prop-types'; | ||
| import pageLoadingIndicator from '@mapbox/mr-ui/page-loading-indicator'; | ||
| import { | ||
| addRouteChangeStartListener, | ||
| addRouteChangeEndListener | ||
| } from '@mapbox/batfish/modules/route-change-listeners'; | ||
|
|
||
| if (typeof window !== 'undefined') { | ||
| import( | ||
| /* webpackChunkName: "assembly-js" */ '@mapbox/mbx-assembly/dist/assembly.js' | ||
| ); | ||
| } | ||
|
|
||
| addRouteChangeStartListener(() => { | ||
| pageLoadingIndicator.start(); | ||
| }); | ||
| addRouteChangeEndListener(() => { | ||
| pageLoadingIndicator.end(); | ||
| }); | ||
|
|
||
| class ApplicationWrapper extends React.Component { | ||
| render() { | ||
| return ( | ||
| <div> | ||
| <Helmet> | ||
| <meta charSet="utf-8" /> | ||
| <meta name="viewport" content="width=device-width,initial-scale=1" /> | ||
| <meta name="robots" content="noindex" /> | ||
| <title>Dr. UI</title> | ||
| </Helmet> | ||
| {this.props.children} | ||
| </div> | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| ApplicationWrapper.propTypes = { | ||
| children: PropTypes.node | ||
| }; | ||
|
|
||
| export default ApplicationWrapper; |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,32 @@ | ||
| --- | ||
| title: Overview | ||
| description: UI components for Mapbox documentation projects. | ||
| prependJs: | ||
| - "import Note from '../../../src/components/note'" | ||
| - "import OverviewHeader from '../../../src/components/overview-header'" | ||
| - "import App from '../app.js'" | ||
| - "const version = require('../../../package.json').version;" | ||
| --- | ||
|
|
||
| {{<OverviewHeader | ||
| features={[ | ||
| 'React components', | ||
| 'Support for IE11 and all modern browsers' | ||
| ]} | ||
| image={<div />} | ||
| title="Dr. UI" | ||
| version={version} | ||
| changelogLink="/dr-ui/changelog/" | ||
| installLink="https://github.com/mapbox/dr-ui/blob/master/README.md" | ||
| ghLink="https://github.com/mapbox/dr-ui" | ||
| />}} | ||
|
|
||
| Pronounced "Doctor UI". **D**ocumentation **R**eact **UI** components. [See @mapbox/mr-ui](https://mapbox.github.io/mr-ui/). | ||
|
|
||
| UI components for Mapbox documentation projects. | ||
|
|
||
| {{<Note>}} | ||
| This project is for internal Mapbox usage. The code is open source and we appreciate bug reports; but we will only consider feature requests and pull requests from Mapbox developers. | ||
| {{</Note>}} | ||
|
|
||
| {{<App />}} |
Oops, something went wrong.