diff --git a/docs/components/example.js b/docs/components/example.js index daaa0da4a90..12df470acc4 100644 --- a/docs/components/example.js +++ b/docs/components/example.js @@ -66,6 +66,8 @@ ${html} render() { const {frontMatter} = this.props; + frontMatter.language = ['JavaScript']; + frontMatter.contentType = 'example'; return (
diff --git a/docs/components/markdown-page-shell.js b/docs/components/markdown-page-shell.js index f18e83d1d73..0b8947cf456 100644 --- a/docs/components/markdown-page-shell.js +++ b/docs/components/markdown-page-shell.js @@ -14,6 +14,9 @@ class MarkdownPageshell extends React.Component { if (!meta.pathname) { meta.pathname = location.pathname; } + if (frontMatter.contentType) meta.contentType = frontMatter.contentType; + if (frontMatter.language) meta.language = frontMatter.language; + if (frontMatter.level) meta.level = frontMatter.level; return (
diff --git a/docs/components/page_shell.js b/docs/components/page_shell.js index c80d03d7088..23c741c472c 100644 --- a/docs/components/page_shell.js +++ b/docs/components/page_shell.js @@ -217,7 +217,7 @@ class PageShell extends React.Component { }; return ( - + ]*>/g, '') // Remove setext-style headers + .replace(/^[=\-]{2,}\s*$/g, '') // Remove footnotes? + .replace(/\[\^.+?\](\: .*?$)?/g, '').replace(/\s{0,2}\[.*?\]: .*?$/g, '') // Remove images + .replace(/\!\[(.*?)\][\[\(].*?[\]\)]/g, options.useImgAltText ? '$1' : '') // Remove inline links + .replace(/\[(.*?)\][\[\(].*?[\]\)]/g, '$1') // Remove blockquotes + .replace(/^\s{0,3}>\s?/g, '') // Remove reference-style links? + .replace(/^\s{1,2}\[(.*?)\]: (\S+)( ".*?")?\s*$/g, '') // Remove atx-style headers + .replace(/^(\n)?\s{0,}#{1,6}\s+| {0,}(\n)?\s{0,}#{0,} {0,}(\n)?\s{0,}$/gm, '$1$2$3') // Remove emphasis (repeat the line to remove double emphasis) + .replace(/([\*_]{1,3})(\S.*?\S{0,1})\1/g, '$2').replace(/([\*_]{1,3})(\S.*?\S{0,1})\1/g, '$2') // Remove code blocks + .replace(/(`{3,})(.*?)\1/gm, '$2') // Remove inline code + .replace(/`(.+?)`/g, '$1') // Replace two or more newlines with exactly two? Not entirely sure this belongs here... + .replace(/\n{2,}/g, '\n\n'); + } catch (e) { + console.error(e); + return md; + } + + return output; +}; + function MetaTagger(props) { - var suffixedTitle = /^Mapbox/.test(props.title) ? props.title : "".concat(props.title, " | Mapbox"); + var site = props.subsite ? props.subsite : props.site; + var suffixedTitle = /^Mapbox/.test(props.title) ? props.title : "".concat(props.title === site ? props.title : "".concat(props.title, " | ").concat(site), " | Mapbox"); var preppedDescription = props.description.replace(/\s+/g, ' '); var prodUrl = 'https://www.mapbox.com'; if (props.pathname[0] !== '/') prodUrl += '/'; prodUrl += props.pathname; var metaItems = [{ name: 'description', - content: preppedDescription + content: removeMarkdown(preppedDescription) }]; metaItems.push({ name: 'twitter:title', @@ -917,10 +962,10 @@ function MetaTagger(props) { content: props.title }, { name: 'twitter:description', - content: preppedDescription + content: removeMarkdown(preppedDescription) }, { property: 'og:description', - content: preppedDescription + content: removeMarkdown(preppedDescription) }, { property: 'og:url', content: prodUrl @@ -936,7 +981,7 @@ function MetaTagger(props) { class: 'swiftype', name: 'excerpt', 'data-type': 'string', - content: props.description + content: removeMarkdown(props.description) }, { name: 'twitter:image:alt', content: props.imageAlt @@ -948,8 +993,51 @@ function MetaTagger(props) { name: 'image', 'data-type': 'enum', content: props.imageUrl + }, { + class: 'swiftype', + name: 'site', + 'data-type': 'string', + content: props.site }); + if (props.subsite) { + metaItems.push({ + class: 'swiftype', + name: 'subsite', + 'data-type': 'string', + content: props.subsite + }); + } + + if (props.contentType) { + metaItems.push({ + class: 'swiftype', + name: 'contentType', + 'data-type': 'string', + content: props.contentType + }); + } + + if (props.language) { + props.language.forEach(function (language) { + metaItems.push({ + class: 'swiftype', + name: 'codeLanguage', + 'data-type': 'string', + content: language + }); + }); + } + + if (props.level) { + metaItems.push({ + class: 'swiftype', + name: 'level', + 'data-type': 'string', + content: props.level + }); + } + if (props.largeImage) { metaItems.push({ name: 'twitter:card', @@ -968,6 +1056,13 @@ function MetaTagger(props) { }); } + if (props.hideFromSearchEngines) { + metaItems.push({ + name: 'robots', + content: 'noindex, nofollow' + }); + } + return React.createElement(Helmet__default, { title: suffixedTitle, meta: metaItems @@ -978,10 +1073,16 @@ MetaTagger.propTypes = { title: PropTypes.string.isRequired, description: PropTypes.string.isRequired, pathname: PropTypes.string.isRequired, + site: PropTypes.string.isRequired, + subsite: PropTypes.string, + contentType: PropTypes.string, imageUrl: PropTypes.string, imageUrlThumbnail: PropTypes.string, imageAlt: PropTypes.string, - largeImage: PropTypes.bool + largeImage: PropTypes.bool, + language: PropTypes.array, + level: PropTypes.number, + hideFromSearchEngines: PropTypes.bool }; MetaTagger.defaultProps = { imageUrl: DEFAULT_SOCIAL_IMAGE_URL, @@ -1055,7 +1156,10 @@ function (_React$Component) { minHeight: '100vh', overflowX: 'hidden' } - }, React.createElement(PageHelmet, null), React.createElement(MetaTagger, this.props.meta), React.createElement("div", { + }, React.createElement(PageHelmet, null), React.createElement(MetaTagger, _extends({}, this.props.meta, { + site: this.props.site, + subsite: this.props.subsite + })), React.createElement("div", { className: nonFooterClasses }, React.createElement("div", { className: "shell-wrapper" @@ -1080,9 +1184,15 @@ ReactPageShell.propTypes = { meta: PropTypes.shape({ title: PropTypes.string.isRequired, description: PropTypes.string.isRequired, - pathname: PropTypes.string + contentType: PropTypes.string, + pathname: PropTypes.string, + level: PropTypes.number, + codeLanguage: PropTypes.array, + hideFromSearchEngines: PropTypes.bool }).isRequired, children: PropTypes.node.isRequired, + site: PropTypes.string.isRequired, + subsite: PropTypes.string, darkHeaderText: PropTypes.bool, nonFooterBgClass: PropTypes.string, onUser: PropTypes.func