From f5541be7ead555c3aa295163a36119cd0974ba9f Mon Sep 17 00:00:00 2001 From: Rafe Goldberg Date: Thu, 23 Jan 2020 11:33:27 -0800 Subject: [PATCH] ReadMe Flavored Markdown (#306 Rebase) (#398) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * HACKZ * hackz; dont judge! * custom slate mdast serializer rules and way too much more... * more blocks! * fix html viewport * fix tables still have to touch up alignment, th rendering, etc * code quality - clean up (nix unused files + deps; simplify naming; etc.) - validate and reformat shitty code * more code reformatting * polish magic block parser * code coverage - add tests for magic block conversions - add tests for multi md renderer exports * fix ordered-list serialization * add MD fixtures add extra markdown content fixtures to test against * restructure unified plugins collect custom parsers and compilers in to sub-directories * fix the render.md tests should take an AST obj and return a MD string * minor format fixes * turn off commonmark * block conversion commands * initial restructure - move renderers to own files (marks, decorations, blocks) - move commands/plugins to own files * simplify @readme/markdown method args * minor schema fixes * clean up and some more mess * better editor * fix fig compiler * syntax highlighting * list fixups * abstract slate blocks to configurable plugins * initial ReadMe flavored MD parser * implement flavored markdown * editor polish * adjacent code block parsing - wrap single-break-separated blocks in tabbed editor - show double-break-separated blocks separately * cleanup * initial front end components - much to much exploration, as always - not enough clean up * add build processes to sub-packages * restore default example delete editor working files * externalize hub's content rendering - nix the entire content.jsx loop - internalize components in @rdme/md - use the md.render.hub * build packages * extract hub RdmeWrap renderer * multi code styles * simplify magic imag block conversion don't wrap img in extra figure * pare extraneous top-level dependencies * nix explorative demo files * clean markdown deps * rename RdmeWrap to CodeTabs * nix extraneous files * clean up * ...meaningful method names christ, rafe... * pare extraneous compilers * restore inter-dependent refs works locally, not in PR apps until all sub-packages have been deployed * Update packages/markdown/components/Code.jsx Co-Authored-By: domharrington * Update packages/markdown/components/Code.jsx Co-Authored-By: domharrington * comments * add magic-block parameter conversion * convert magic block tables to markdown * tokenize inline table cell contents * cleanup * chore: resolving some broken builds * fix: downgrade sass-loader for webpack compat https://stackoverflow.com/a/58230550/1341949 * fix: webpack 4 upgrade merge breakage * fix: revert variables to use packaged component * chore: build * fix: broken var context export * refactor(@markdown): clean up index methods, exports * refactor(@markdown): move GlossaryItem to ./components * refactor(@markdown/emoji) move emoji schema in to ./processor * fix(@markdown): scope hub components SCSS * build(@markdown) * run prettier * internalize magicblock string normalization method * rename markdown methods; clean up components * clarity - fix some markdown.react components * add assorted MD fixture files * prettier * ¿can haz i tests? - I am pretty sure I blew away some of the snapshots for anchors with baseURLs, and headings with anchors which seem likely to be critical to certain interactions in our docs! - I am definitely still `skip`ping a few tests (for variable and glossary components) * fix some hast hName stuff * clean up eslint disables * more eslint disable deleting! * update packages * pullin' it all together * revert more unnecessary deps, config changes * docs(markdown): update readme * revert config files * initial magic embed parser + transformer * fix embed display * don't require scss styles in js/jsx it breaks the ReadMe build for whatever reason, even though this seems to work in the explorer... * test build * update readme * Update README.md * Update README.md * Update README.md * Update README.md * update readme * Update README.md * Update README.md * Update README.md * Update README.md * Update README.md * Update README.md * update readme * update readme * Update README.md * Update README.md * various clean up * revert unnecessary changes * more house cleaning! * update readme * update markdown processor * update explorer integrations * fix magic block table alignment * update table head styling * clean up * fix components - implement variable + glossary providers - fix heading levels + anchor links * update main MD styles * update tests * build * style components * fix heading ids for multiple headers of same ID * fix code tabs meta regex parsing * fix: remove extra image caption parsing * fix header anchor incrementation * chore: update beta/editor-rebase with latest master (#435) * fix: Fixing a regression of additionalProperties keys not being editable (#404) * fix: fixing a regression of additionalProperties keys not being editable * chore: refactoring and simplifying the label logic * chore: updating dist files * v4.13.3 * chore: Bump css-loader from 3.2.1 to 3.3.2 (#405) Bumps [css-loader](https://github.com/webpack-contrib/css-loader) from 3.2.1 to 3.3.2. - [Release notes](https://github.com/webpack-contrib/css-loader/releases) - [Changelog](https://github.com/webpack-contrib/css-loader/blob/master/CHANGELOG.md) - [Commits](https://github.com/webpack-contrib/css-loader/compare/v3.2.1...v3.3.2) Signed-off-by: dependabot-preview[bot] * chore: Bump @readme/eslint-config from 1.7.0 to 1.8.0 (#406) * chore: Bump @readme/eslint-config from 1.7.0 to 1.8.0 Bumps [@readme/eslint-config](https://github.com/readmeio/eslint-config) from 1.7.0 to 1.8.0. - [Release notes](https://github.com/readmeio/eslint-config/releases) - [Changelog](https://github.com/readmeio/eslint-config/blob/master/CHANGELOG.md) - [Commits](https://github.com/readmeio/eslint-config/commits) Signed-off-by: dependabot-preview[bot] * style: resolving style issues with test formatting * style: resolving style issues with test formatting * style: resolving style issues with test formatting * refactor: refer to new pointers for log (#407) * ♻️ refer to new pointers for log * ✅ fix the tests * 🚨 prettier * chore: dist updates * v4.14.0 * chore: Bump @babel/preset-env from 7.7.6 to 7.7.7 (#413) Bumps [@babel/preset-env](https://github.com/babel/babel) from 7.7.6 to 7.7.7. - [Release notes](https://github.com/babel/babel/releases) - [Changelog](https://github.com/babel/babel/blob/master/CHANGELOG.md) - [Commits](https://github.com/babel/babel/compare/v7.7.6...v7.7.7) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump @readme/eslint-config from 1.8.0 to 1.8.1 (#416) Bumps [@readme/eslint-config](https://github.com/readmeio/eslint-config) from 1.8.0 to 1.8.1. - [Release notes](https://github.com/readmeio/eslint-config/releases) - [Changelog](https://github.com/readmeio/eslint-config/blob/master/CHANGELOG.md) - [Commits](https://github.com/readmeio/eslint-config/commits/1.8.1) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump eslint from 6.7.2 to 6.8.0 (#410) Bumps [eslint](https://github.com/eslint/eslint) from 6.7.2 to 6.8.0. - [Release notes](https://github.com/eslint/eslint/releases) - [Changelog](https://github.com/eslint/eslint/blob/master/CHANGELOG.md) - [Commits](https://github.com/eslint/eslint/compare/v6.7.2...v6.8.0) Signed-off-by: dependabot-preview[bot] * chore(deps): Bump oas from 1.0.2 to 1.1.0 (#415) Bumps [oas](https://github.com/readmeio/oas) from 1.0.2 to 1.1.0. - [Release notes](https://github.com/readmeio/oas/releases) - [Changelog](https://github.com/readmeio/oas/blob/master/CHANGELOG.md) - [Commits](https://github.com/readmeio/oas/commits) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump enzyme from 3.10.0 to 3.11.0 (#408) Bumps [enzyme](https://github.com/airbnb/enzyme/tree/HEAD/packages/enzyme) from 3.10.0 to 3.11.0. - [Release notes](https://github.com/airbnb/enzyme/releases) - [Changelog](https://github.com/airbnb/enzyme/blob/master/CHANGELOG.md) - [Commits](https://github.com/airbnb/enzyme/commits/enzyme@3.11.0/packages/enzyme) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump webpack from 4.41.2 to 4.41.4 (#409) Bumps [webpack](https://github.com/webpack/webpack) from 4.41.2 to 4.41.4. - [Release notes](https://github.com/webpack/webpack/releases) - [Commits](https://github.com/webpack/webpack/compare/v4.41.2...v4.41.4) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump enzyme-adapter-react-16 from 1.15.1 to 1.15.2 (#417) Bumps [enzyme-adapter-react-16](https://github.com/airbnb/enzyme/tree/HEAD/packages/enzyme-adapter-react-16) from 1.15.1 to 1.15.2. - [Release notes](https://github.com/airbnb/enzyme/releases) - [Changelog](https://github.com/airbnb/enzyme/blob/master/CHANGELOG.md) - [Commits](https://github.com/airbnb/enzyme/commits/enzyme-adapter-react-16@1.15.2/packages/enzyme-adapter-react-16) Signed-off-by: dependabot-preview[bot] * chore(deps): Bump css-loader from 3.3.2 to 3.4.0 (#411) Bumps [css-loader](https://github.com/webpack-contrib/css-loader) from 3.3.2 to 3.4.0. - [Release notes](https://github.com/webpack-contrib/css-loader/releases) - [Changelog](https://github.com/webpack-contrib/css-loader/blob/master/CHANGELOG.md) - [Commits](https://github.com/webpack-contrib/css-loader/compare/v3.3.2...v3.4.0) Signed-off-by: dependabot-preview[bot] * chore(deps): Bump codemirror from 5.49.2 to 5.50.0 (#412) Bumps [codemirror](https://github.com/codemirror/CodeMirror) from 5.49.2 to 5.50.0. - [Release notes](https://github.com/codemirror/CodeMirror/releases) - [Changelog](https://github.com/codemirror/CodeMirror/blob/master/CHANGELOG.md) - [Commits](https://github.com/codemirror/CodeMirror/compare/5.49.2...5.50.0) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump style-loader from 1.0.1 to 1.1.1 (#414) Bumps [style-loader](https://github.com/webpack-contrib/style-loader) from 1.0.1 to 1.1.1. - [Release notes](https://github.com/webpack-contrib/style-loader/releases) - [Changelog](https://github.com/webpack-contrib/style-loader/blob/master/CHANGELOG.md) - [Commits](https://github.com/webpack-contrib/style-loader/compare/v1.0.1...v1.1.1) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump @readme/eslint-config from 1.8.1 to 1.9.0 (#424) Bumps [@readme/eslint-config](https://github.com/readmeio/eslint-config) from 1.8.1 to 1.9.0. - [Release notes](https://github.com/readmeio/eslint-config/releases) - [Changelog](https://github.com/readmeio/eslint-config/blob/master/CHANGELOG.md) - [Commits](https://github.com/readmeio/eslint-config/compare/1.8.1...1.9.0) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump lerna from 3.19.0 to 3.20.2 (#428) Bumps [lerna](https://github.com/lerna/lerna/tree/HEAD/core/lerna) from 3.19.0 to 3.20.2. - [Release notes](https://github.com/lerna/lerna/releases) - [Changelog](https://github.com/lerna/lerna/blob/master/core/lerna/CHANGELOG.md) - [Commits](https://github.com/lerna/lerna/commits/v3.20.2/core/lerna) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump nock from 11.7.0 to 11.7.1 (#425) Bumps [nock](https://github.com/nock/nock) from 11.7.0 to 11.7.1. - [Release notes](https://github.com/nock/nock/releases) - [Changelog](https://github.com/nock/nock/blob/master/CHANGELOG.md) - [Commits](https://github.com/nock/nock/compare/v11.7.0...v11.7.1) Signed-off-by: dependabot-preview[bot] * chore(deps): [Security] Bump handlebars from 4.1.2 to 4.5.3 (#418) Bumps [handlebars](https://github.com/wycats/handlebars.js) from 4.1.2 to 4.5.3. **This update includes a security fix.** - [Release notes](https://github.com/wycats/handlebars.js/releases) - [Changelog](https://github.com/wycats/handlebars.js/blob/master/release-notes.md) - [Commits](https://github.com/wycats/handlebars.js/compare/v4.1.2...v4.5.3) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump style-loader from 1.1.1 to 1.1.2 (#419) Bumps [style-loader](https://github.com/webpack-contrib/style-loader) from 1.1.1 to 1.1.2. - [Release notes](https://github.com/webpack-contrib/style-loader/releases) - [Changelog](https://github.com/webpack-contrib/style-loader/blob/master/CHANGELOG.md) - [Commits](https://github.com/webpack-contrib/style-loader/compare/v1.1.1...v1.1.2) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump webpack-dev-server from 3.9.0 to 3.10.1 (#421) Bumps [webpack-dev-server](https://github.com/webpack/webpack-dev-server) from 3.9.0 to 3.10.1. - [Release notes](https://github.com/webpack/webpack-dev-server/releases) - [Changelog](https://github.com/webpack/webpack-dev-server/blob/v3.10.1/CHANGELOG.md) - [Commits](https://github.com/webpack/webpack-dev-server/compare/v3.9.0...v3.10.1) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump @babel/core from 7.7.5 to 7.7.7 (#422) Bumps [@babel/core](https://github.com/babel/babel) from 7.7.5 to 7.7.7. - [Release notes](https://github.com/babel/babel/releases) - [Changelog](https://github.com/babel/babel/blob/master/CHANGELOG.md) - [Commits](https://github.com/babel/babel/compare/v7.7.5...v7.7.7) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump webpack from 4.41.4 to 4.41.5 (#423) Bumps [webpack](https://github.com/webpack/webpack) from 4.41.4 to 4.41.5. - [Release notes](https://github.com/webpack/webpack/releases) - [Commits](https://github.com/webpack/webpack/compare/v4.41.4...v4.41.5) Signed-off-by: dependabot-preview[bot] * chore(deps-dev): Bump css-loader from 3.4.0 to 3.4.1 (#426) Bumps [css-loader](https://github.com/webpack-contrib/css-loader) from 3.4.0 to 3.4.1. - [Release notes](https://github.com/webpack-contrib/css-loader/releases) - [Changelog](https://github.com/webpack-contrib/css-loader/blob/master/CHANGELOG.md) - [Commits](https://github.com/webpack-contrib/css-loader/compare/v3.4.0...v3.4.1) Signed-off-by: dependabot-preview[bot] * chore(deps): Bump codemirror from 5.50.0 to 5.50.2 (#427) Bumps [codemirror](https://github.com/codemirror/CodeMirror) from 5.50.0 to 5.50.2. - [Release notes](https://github.com/codemirror/CodeMirror/releases) - [Changelog](https://github.com/codemirror/CodeMirror/blob/master/CHANGELOG.md) - [Commits](https://github.com/codemirror/CodeMirror/compare/5.50.0...5.50.2) Signed-off-by: dependabot-preview[bot] * test: updating an out of date fixture that was breaking the local demo (#429) * chore(dev-deps): replacing uglifyjs-webpack-plugin with terser-webpack-plugin (#430) * test: removing codeclimate from our builds (#432) * fix: align params to top (#431) * chore: dist updates * v4.15.0 * test: setting up a github workflow for running unit tests (#434) * test: setting up a github workflow for running unit tests * docs: updating readmes with a github workflow ci badge * fix: resolving some eslint callouts Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com> Co-authored-by: Sean Co-authored-by: Rafe Goldberg * fix: coverage report handlebars instance errors Fix per this issue: https://github.com/facebook/jest/issues/9396#issuecomment-573328488 * chore: update sanitization schema * chore: update tests - remove end line breaks - dont expect user content prefixs - dont allow extraneous p tags in markup - update snapshots * test: move var + glossary tests - move tests in to components.test.js - render react md w/ context providers - update snapshots * test: rdmd react component rendering * test: reenable coverage reporting * make ALMOST all tests ALMOST work * fix: header anchor incrementation * fix tests * chore: remove api-explorer custom magic block parsers * fix image captions for magic blocks * test: magic img blocks with captions * fix: suppress pinned content sidebar ...for now * fix: render pinned text blocks * fix three column layout * fix two col css * more css fixes * fix layout themes * style: scroll CodeTabs-toolbar x-overflow content * style: extract markdown overrides in explorer styles * style: markdown components * fix: pre-markdown normalization append a normal, rather than a non-breaking, space at end of str * test: update snapshots to account for updated newline normalization * update readme * unskip tests * clean up Code component * rename magic block test suite * nix unnecessary markdown test files * clean up magic block parser * revert petstore example * revert explorer dist changes * revert api-logs dist * clean up test snapshots * move test data vars in to respective tests * update readme * require src for images * fix eslint issues * fix tabbed template strings * Update packages/api-explorer/src/block-types/Content.jsx Co-Authored-By: Jon Ursenbach * Update packages/markdown/.babelrc Co-Authored-By: Jon Ursenbach * Update packages/markdown/.jsinspectrc Co-Authored-By: Jon Ursenbach * Update packages/markdown/README.md Co-Authored-By: Jon Ursenbach * dont run embedly from the front end breaks rdmd embeds; still work for magicblocks! * update test expectations * nix comment Co-authored-by: domharrington Co-authored-by: Jon Ursenbach Co-authored-by: dependabot-preview[bot] <27856297+dependabot-preview[bot]@users.noreply.github.com> Co-authored-by: Sean --- .babelrc | 3 +- jest.config.js | 1 + package-lock.json | 5 + package.json | 10 +- .../__tests__/ResponseSchema.test.jsx | 15 +- .../__tests__/ResponseSchemaBody.test.jsx | 2 +- .../__tests__/block-types/ApiHeader.test.jsx | 29 - .../__tests__/block-types/CallOut.test.jsx | 94 - .../__tests__/block-types/Code.test.jsx | 143 - .../__tests__/block-types/Content.test.jsx | 86 - .../__tests__/block-types/Embed.test.jsx | 65 - .../__tests__/block-types/Html.test.jsx | 19 - .../__tests__/block-types/Image.test.jsx | 60 - .../__tests__/block-types/Parameters.test.jsx | 29 - .../__tests__/block-types/TextArea.test.jsx | 14 - .../__snapshots__/CallOut.test.jsx.snap | 8 - .../__tests__/block-types/blocks.txt | 82 - .../form-components/DescriptionField.test.jsx | 2 +- packages/api-explorer/src/Doc.jsx | 2 +- packages/api-explorer/src/ResponseSchema.jsx | 2 +- .../api-explorer/src/ResponseSchemaBody.jsx | 2 +- .../src/block-types/ApiHeader.jsx | 33 - .../api-explorer/src/block-types/CallOut.jsx | 63 - .../api-explorer/src/block-types/Code.jsx | 99 - .../src/block-types/CodeElement.jsx | 64 - .../api-explorer/src/block-types/Content.jsx | 84 +- .../api-explorer/src/block-types/Embed.jsx | 57 - .../api-explorer/src/block-types/Html.jsx | 16 - .../api-explorer/src/block-types/Image.jsx | 45 - .../src/block-types/Parameters.jsx | 74 - .../api-explorer/src/block-types/TextArea.jsx | 20 - .../src/form-components/DescriptionField.jsx | 2 +- .../src/lib/parse-magic-blocks.js | 62 - packages/api-explorer/style/main.scss | 2 + .../style/markdown-overrides.scss | 49 + packages/markdown/.babelrc | 14 + packages/markdown/.eslintignore | 1 + packages/markdown/.jsinspectrc | 2 +- packages/markdown/README.md | 165 +- .../markdown/__tests__/GlossaryItem.test.jsx | 4 +- .../flavored-compilers.test.js.snap | 27 + .../flavored-parsers.test.js.snap | 124 + .../__snapshots__/index.test.js.snap | 675 +- .../magic-block-parser.test.js.snap | 363 + .../markdown/__tests__/components.test.js | 112 + .../__tests__/flavored-compilers.test.js | 89 + .../__tests__/flavored-parsers.test.js | 40 + .../markdown/__tests__/gemoji-parser.test.js | 4 +- packages/markdown/__tests__/index.test.js | 189 +- .../__tests__/magic-block-parser.test.js | 133 + .../__tests__/variable-parser.test.js | 3 +- packages/markdown/components/Anchor.jsx | 20 +- .../markdown/components/Callout/index.jsx | 50 + .../markdown/components/Callout/style.scss | 52 + packages/markdown/components/Code.jsx | 15 +- .../markdown/components/CodeTabs/index.jsx | 59 + .../markdown/components/CodeTabs/style.scss | 70 + packages/markdown/components/Embed.jsx | 88 + .../{ => components}/GlossaryItem.jsx | 11 +- packages/markdown/components/Heading.jsx | 31 - .../markdown/components/Heading/index.jsx | 49 + .../markdown/components/Heading/style.scss | 29 + packages/markdown/components/Image.jsx | 53 + packages/markdown/components/Table.jsx | 9 +- packages/markdown/dist/main.js | 79827 ++++++++++++++++ packages/markdown/example.js | 0 packages/markdown/index.js | 258 +- packages/markdown/package-lock.json | 25 + packages/markdown/package.json | 13 +- .../markdown/processor/compile/callout.js | 9 + .../markdown/processor/compile/code-tabs.js | 12 + packages/markdown/processor/compile/div.js | 8 + packages/markdown/processor/compile/embed.js | 8 + packages/markdown/processor/compile/pin.js | 8 + packages/markdown/processor/compile/var.js | 6 + packages/markdown/{ => processor}/emojis.js | 0 packages/markdown/processor/options.json | 16 + .../processor/parse/flavored/callout.js | 61 + .../processor/parse/flavored/code-tabs.js | 57 + .../processor/parse/flavored/embed.js | 47 + .../{ => processor/parse}/gemoji-parser.js | 4 +- .../processor/parse/magic-block-parser.js | 218 + .../{ => processor/parse}/variable-parser.js | 1 + packages/markdown/styles/gfm.overrides.scss | 99 + packages/markdown/styles/gfm.scss | 1012 + packages/markdown/styles/main.scss | 5 + packages/markdown/webpack.config.js | 51 + packages/variable/index.jsx | 1 + 88 files changed, 84103 insertions(+), 1467 deletions(-) delete mode 100644 packages/api-explorer/__tests__/block-types/ApiHeader.test.jsx delete mode 100644 packages/api-explorer/__tests__/block-types/CallOut.test.jsx delete mode 100644 packages/api-explorer/__tests__/block-types/Code.test.jsx delete mode 100644 packages/api-explorer/__tests__/block-types/Content.test.jsx delete mode 100644 packages/api-explorer/__tests__/block-types/Embed.test.jsx delete mode 100644 packages/api-explorer/__tests__/block-types/Html.test.jsx delete mode 100644 packages/api-explorer/__tests__/block-types/Image.test.jsx delete mode 100644 packages/api-explorer/__tests__/block-types/Parameters.test.jsx delete mode 100644 packages/api-explorer/__tests__/block-types/TextArea.test.jsx delete mode 100644 packages/api-explorer/__tests__/block-types/__snapshots__/CallOut.test.jsx.snap delete mode 100644 packages/api-explorer/__tests__/block-types/blocks.txt delete mode 100644 packages/api-explorer/src/block-types/ApiHeader.jsx delete mode 100644 packages/api-explorer/src/block-types/CallOut.jsx delete mode 100644 packages/api-explorer/src/block-types/Code.jsx delete mode 100644 packages/api-explorer/src/block-types/CodeElement.jsx delete mode 100644 packages/api-explorer/src/block-types/Embed.jsx delete mode 100644 packages/api-explorer/src/block-types/Html.jsx delete mode 100644 packages/api-explorer/src/block-types/Image.jsx delete mode 100644 packages/api-explorer/src/block-types/Parameters.jsx delete mode 100644 packages/api-explorer/src/block-types/TextArea.jsx delete mode 100644 packages/api-explorer/src/lib/parse-magic-blocks.js create mode 100644 packages/api-explorer/style/markdown-overrides.scss create mode 100644 packages/markdown/.babelrc create mode 100644 packages/markdown/__tests__/__snapshots__/flavored-compilers.test.js.snap create mode 100644 packages/markdown/__tests__/__snapshots__/flavored-parsers.test.js.snap create mode 100644 packages/markdown/__tests__/__snapshots__/magic-block-parser.test.js.snap create mode 100644 packages/markdown/__tests__/components.test.js create mode 100644 packages/markdown/__tests__/flavored-compilers.test.js create mode 100644 packages/markdown/__tests__/flavored-parsers.test.js create mode 100644 packages/markdown/__tests__/magic-block-parser.test.js create mode 100644 packages/markdown/components/Callout/index.jsx create mode 100644 packages/markdown/components/Callout/style.scss create mode 100644 packages/markdown/components/CodeTabs/index.jsx create mode 100644 packages/markdown/components/CodeTabs/style.scss create mode 100644 packages/markdown/components/Embed.jsx rename packages/markdown/{ => components}/GlossaryItem.jsx (75%) delete mode 100644 packages/markdown/components/Heading.jsx create mode 100644 packages/markdown/components/Heading/index.jsx create mode 100644 packages/markdown/components/Heading/style.scss create mode 100644 packages/markdown/components/Image.jsx create mode 100644 packages/markdown/dist/main.js delete mode 100644 packages/markdown/example.js create mode 100644 packages/markdown/processor/compile/callout.js create mode 100644 packages/markdown/processor/compile/code-tabs.js create mode 100644 packages/markdown/processor/compile/div.js create mode 100644 packages/markdown/processor/compile/embed.js create mode 100644 packages/markdown/processor/compile/pin.js create mode 100644 packages/markdown/processor/compile/var.js rename packages/markdown/{ => processor}/emojis.js (100%) create mode 100644 packages/markdown/processor/options.json create mode 100644 packages/markdown/processor/parse/flavored/callout.js create mode 100644 packages/markdown/processor/parse/flavored/code-tabs.js create mode 100644 packages/markdown/processor/parse/flavored/embed.js rename packages/markdown/{ => processor/parse}/gemoji-parser.js (91%) create mode 100644 packages/markdown/processor/parse/magic-block-parser.js rename packages/markdown/{ => processor/parse}/variable-parser.js (98%) create mode 100644 packages/markdown/styles/gfm.overrides.scss create mode 100644 packages/markdown/styles/gfm.scss create mode 100644 packages/markdown/styles/main.scss create mode 100644 packages/markdown/webpack.config.js diff --git a/.babelrc b/.babelrc index 71345abd2..4aa3c3cdd 100644 --- a/.babelrc +++ b/.babelrc @@ -6,5 +6,6 @@ } }], "@babel/preset-react" - ] + ], + "plugins": ["@babel/plugin-proposal-class-properties"] } diff --git a/jest.config.js b/jest.config.js index 940766a62..72fcd0b7a 100644 --- a/jest.config.js +++ b/jest.config.js @@ -2,6 +2,7 @@ const path = require('path'); module.exports = { testURL: 'http://localhost', + coverageReporters: ['json', 'text', 'lcov', 'clover'], // per https://github.com/facebook/jest/issues/9396#issuecomment-573328488 coverageThreshold: { global: { branches: 90, diff --git a/package-lock.json b/package-lock.json index e2e095d07..1f2db3db0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -17654,6 +17654,11 @@ } } }, + "remark-breaks": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/remark-breaks/-/remark-breaks-1.0.3.tgz", + "integrity": "sha512-ip5hvJE8vsUJCGfgHaEJbf/JfO6KTZV+NBG68AWkEMhrjHW3Qh7EorED41mCt0FFSTrUDeRiNHovKO7cqgPZmw==" + }, "remove-trailing-separator": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.0.2.tgz", diff --git a/package.json b/package.json index 60ca86fd6..320aef520 100644 --- a/package.json +++ b/package.json @@ -23,6 +23,8 @@ }, "devDependencies": { "@babel/core": "^7.4.4", + "@babel/plugin-proposal-class-properties": "^7.5.5", + "@babel/plugin-proposal-object-rest-spread": "^7.6.2", "@babel/preset-env": "^7.4.4", "@babel/preset-react": "^7.0.0", "@readme/eslint-config": "^1.7.0", @@ -40,7 +42,7 @@ "lerna": "^3.14.1", "node-sass": "^4.12.0", "prettier": "^1.19.1", - "sass-loader": "^8.0.0", + "sass-loader": "^7.3.1", "style-loader": "^1.0.0", "terser-webpack-plugin": "^2.3.1", "webpack": "^4.41.0", @@ -51,9 +53,9 @@ "dependencies": { "babel-polyfill": "^6.26.0", "prop-types": "^15.7.2", - "react": "^16.4.2", - "react-dom": "^16.4.2", - "react-hot-loader": "^4.12.14", + "react": "^16.6.0", + "react-dom": "^16.6.0", + "react-hot-loader": "^3.1.3", "swagger2openapi": "^5.3.1", "whatwg-fetch": "^3.0.0" } diff --git a/packages/api-explorer/__tests__/ResponseSchema.test.jsx b/packages/api-explorer/__tests__/ResponseSchema.test.jsx index 6fec04bc6..054e03db6 100644 --- a/packages/api-explorer/__tests__/ResponseSchema.test.jsx +++ b/packages/api-explorer/__tests__/ResponseSchema.test.jsx @@ -36,13 +36,14 @@ test('selectedStatus should change state of selectedStatus', () => { test('should display response schema description', () => { const responseSchema = shallow(); - - expect( - responseSchema - .find('div.desc') - .first() - .text(), - ).toBe(props.operation.responses['200'].description); + const text = responseSchema + .find('div.desc') + .first() + .find('div.desc') + .find('p') + .first() + .text(); + expect(text).toBe(props.operation.responses['200'].description); }); test('should work if there are no responses', () => { diff --git a/packages/api-explorer/__tests__/ResponseSchemaBody.test.jsx b/packages/api-explorer/__tests__/ResponseSchemaBody.test.jsx index e97e7121e..0246e9931 100644 --- a/packages/api-explorer/__tests__/ResponseSchemaBody.test.jsx +++ b/packages/api-explorer/__tests__/ResponseSchemaBody.test.jsx @@ -259,7 +259,7 @@ test('should render markdown in the description', () => { mount() .find('a') .html(), - ).toBe('Description'); + ).toBe('Description'); }); test('should show "string" response type for a simple `string` schema', () => { diff --git a/packages/api-explorer/__tests__/block-types/ApiHeader.test.jsx b/packages/api-explorer/__tests__/block-types/ApiHeader.test.jsx deleted file mode 100644 index fa74d2994..000000000 --- a/packages/api-explorer/__tests__/block-types/ApiHeader.test.jsx +++ /dev/null @@ -1,29 +0,0 @@ -const React = require('react'); -const { shallow } = require('enzyme'); -const ApiHeader = require('../../src/block-types/ApiHeader'); - -const block = { - type: 'api-header', - data: { - title: 'This is header', - type: 'post', - }, -}; - -describe('ApiHeader', () => { - it('Api Header will render text in table header cells', () => { - const apiHeader = shallow(); - expect(apiHeader.find('h1').text()).toBe('This is header'); - }); - - it('should render with the type in a span', () => { - const apiHeader = shallow(); - expect(apiHeader.find(`span.type-${block.data.type}`)).toHaveLength(1); - }); - - it('should create an #id with the slug of the title', () => { - const apiHeader = shallow(); - expect(apiHeader.find(`span#this-is-header`)).toHaveLength(1); - expect(apiHeader.find(`#section-this-is-header`)).toHaveLength(1); - }); -}); diff --git a/packages/api-explorer/__tests__/block-types/CallOut.test.jsx b/packages/api-explorer/__tests__/block-types/CallOut.test.jsx deleted file mode 100644 index 470336f8f..000000000 --- a/packages/api-explorer/__tests__/block-types/CallOut.test.jsx +++ /dev/null @@ -1,94 +0,0 @@ -const React = require('react'); -const { shallow, mount } = require('enzyme'); -const CallOut = require('../../src/block-types/CallOut'); - -test('should render title', () => { - const block = { - data: { - type: 'info', - title: 'Callout', - }, - }; - const callout = mount(); - expect(callout.find('h3').text()).toBe('Callout'); -}); - -describe('icons', () => { - const icons = { - info: 'info-circle', - warning: 'exclamation-circle', - danger: 'exclamation-triangle', - success: 'check-square', - }; - - it('should render with title', () => { - Object.keys(icons).forEach(type => { - const className = icons[type]; - const block = { - data: { - type, - title: 'Callout', - }, - }; - expect(mount().find(`.fa-${className}`)).toHaveLength(1); - }); - }); - - it('should render without title', () => { - Object.keys(icons).forEach(type => { - const className = icons[type]; - const block = { - data: { - type, - }, - }; - expect(mount().find(`.noTitleIcon .fa-${className}`)).toHaveLength( - 1, - ); - }); - }); -}); - -test('should render nothing if no title and icon', () => { - const block = { - data: { - type: '', - }, - }; - const callout = mount(); - expect(callout.find('span').text()).toBe(''); -}); - -test('should render body', () => { - const block = { - data: { - type: 'info', - body: 'body', - }, - }; - - const callout = shallow(); - expect( - callout - .render() - .find('.callout-body') - .html(), - ).toMatchSnapshot(); -}); - -test('should render markdown in body', () => { - const block = { - data: { - type: 'info', - body: '# heading\n`test`', - }, - }; - - const callout = shallow(); - expect( - callout - .render() - .find('.callout-body') - .html(), - ).toMatchSnapshot(); -}); diff --git a/packages/api-explorer/__tests__/block-types/Code.test.jsx b/packages/api-explorer/__tests__/block-types/Code.test.jsx deleted file mode 100644 index 34a632187..000000000 --- a/packages/api-explorer/__tests__/block-types/Code.test.jsx +++ /dev/null @@ -1,143 +0,0 @@ -const React = require('react'); -const { mount } = require('enzyme'); -const Code = require('../../src/block-types/Code'); - -const block = { - type: 'code', - sidebar: undefined, - data: { - codes: [ - { - code: 'whjdwhjwejhkwhjk', - language: 'text', - status: 400, - name: 'test', - }, - { - code: 'var a = 1', - language: 'javascript', - }, - { - code: 'whjdwhjwejhkwhjk', - language: 'text', - name: 'test', - }, - ], - }, -}; - -const block3 = { - type: 'code', - sidebar: undefined, - data: { - codes: [ - { - code: 'whjdwhjwejhkwhjk', - language: 'text', - status: 400, - }, - ], - }, -}; - -const badBlock = { - type: 'code', - sidebar: undefined, - data: { - codes: { - code: { - code: 'whjdwhjwejhkwhjk', - language: 'text', - status: 400, - }, - }, - }, -}; - -const block2 = { - type: 'code', - sidebar: undefined, - data: { - codes: [ - { - code: 'var a = 1', - language: 'javascript', - }, - ], - }, -}; - -test('Code will render name if provided within em tag if codes has a status', () => { - const codeInput = mount(); - expect(codeInput.find('em').text()).toBe('test'); -}); - -test('Code will render status code within em tag', () => { - const codeInput = mount(); - expect(codeInput.find('em').text()).toBe('Bad Request'); -}); - -test('If codes array is not passed as an array expect empty array', () => { - const codeInput = mount(); - - expect(codeInput.find('span').text()).toBe(''); -}); - -test('Code will render language if name or status is not provided within a tag if codes has a status', () => { - const codeInput = mount(); - expect(codeInput.find('a').text()).toBe('JavaScript'); -}); - -test('Code will render label if provided within opts', () => { - const codeInput = mount(); - expect(codeInput.find('label').text()).toBe('label'); -}); - -test('Code should switch tabs', () => { - const codeInput = mount(); - const anchor = codeInput.find('li a').at(1); - anchor.simulate('click'); - expect(anchor.render().hasClass('active')).toBe(true); -}); - -test('should uppercase known languages', () => { - expect( - mount( - , - ) - .find('li a') - .text(), - ).toBe('HTTP'); -}); - -test('should pass through unknown languages', () => { - expect( - mount( - , - ) - .find('li a') - .text(), - ).toBe('unknown-language-somehow'); -}); diff --git a/packages/api-explorer/__tests__/block-types/Content.test.jsx b/packages/api-explorer/__tests__/block-types/Content.test.jsx deleted file mode 100644 index a51f82b7c..000000000 --- a/packages/api-explorer/__tests__/block-types/Content.test.jsx +++ /dev/null @@ -1,86 +0,0 @@ -const React = require('react'); -const fs = require('fs'); -const { mount } = require('enzyme'); -const Content = require('../../src/block-types/Content'); - -test('should output one of each block type', () => { - const body = fs.readFileSync(`${__dirname}/blocks.txt`, 'utf8'); - const content = mount(); - - ['textarea', 'html', 'embed', 'api-header', 'code', 'callout', 'parameters', 'image'].forEach( - type => { - expect(content.find(`.magic-block-${type}`)).toHaveLength(1); - }, - ); -}); - -const body = ` - [block:api-header] - { - "title": "This is cool header", - "sidebar": true - } - [/block] - [block:textarea] - { - "text": "This is text area" - } - [/block] -`; - -test('should output only left content if `isThreeColumn=left`', () => { - const content = mount(); - - expect(content.find('.magic-block-textarea')).toHaveLength(1); -}); - -test('should output only right content if `isThreeColumn=right`', () => { - const content = mount(); - - expect(content.find('.magic-block-api-header')).toHaveLength(1); -}); - -test('should make code not-dark if it is in the left column', () => { - const content = mount( - , - ); - - expect(content.html()).toContain('cm-s-neo'); -}); - -test('should make code `dark` if it is in right column', () => { - const content = mount( - , - ); - - expect(content.html()).toContain('cm-s-tomorrow-night'); -}); diff --git a/packages/api-explorer/__tests__/block-types/Embed.test.jsx b/packages/api-explorer/__tests__/block-types/Embed.test.jsx deleted file mode 100644 index aee2cf003..000000000 --- a/packages/api-explorer/__tests__/block-types/Embed.test.jsx +++ /dev/null @@ -1,65 +0,0 @@ -const React = require('react'); -const { shallow } = require('enzyme'); -const Embed = require('../../src/block-types/Embed'); - -describe('Embed', () => { - it('Embed will have src property if iframe is true', () => { - const block = { - type: 'embed', - data: { - html: false, - url: 'http://jsbin.com/fewilipowi/edit?js,output', - title: 'JS Bin', - favicon: 'http://static.jsbin.com/images/favicon.png', - image: 'http://static.jsbin.com/images/logo.png', - iframe: true, - }, - sidebar: undefined, - }; - const embedInput = shallow(); - expect(embedInput.find('iframe').prop('src')).toBe( - 'http://jsbin.com/fewilipowi/edit?js,output', - ); - // expect(embedInput.find('iframe').text()).toBe(''); - }); - - it('Embed will have no text property if iframe is false', () => { - const url = - ''; - const block = { - type: 'embed', - data: { - favicon: 'https://s.ytimg.com/yts/img/ringo/img/favicon-vfl8qSV2F.ico', - html: url, - image: 'https://i.ytimg.com/vi/jYjDqzZ4gjY/hqdefault.jpg', - sidebar: true, - title: 'White kids Watch me whip school Chorus', - url: 'https://www.youtube.com/watch?v=jYjDqzZ4gjY', - }, - sidebar: true, - }; - const embedInput = shallow(); - - expect(embedInput.find('span').text()).toBe(''); - }); - - it('Embed will have a and img tag if favicon is provided but iframe and html condition is false', () => { - const block = { - type: 'embed', - data: { - html: false, - url: 'http://jsbin.com/fewilipowi/edit?js,output', - favicon: 'http://static.jsbin.com/images/favicon.png', - image: 'http://static.jsbin.com/images/logo.png', - iframe: false, - width: '100%', - height: '300px', - }, - sidebar: undefined, - }; - const embedInput = shallow(); - expect(embedInput.find('strong').html()).toBe( - 'http://jsbin.com/fewilipowi/edit?js,output', - ); - }); -}); diff --git a/packages/api-explorer/__tests__/block-types/Html.test.jsx b/packages/api-explorer/__tests__/block-types/Html.test.jsx deleted file mode 100644 index 28ce0f30d..000000000 --- a/packages/api-explorer/__tests__/block-types/Html.test.jsx +++ /dev/null @@ -1,19 +0,0 @@ -const React = require('react'); -const { shallow } = require('enzyme'); -const Html = require('../../src/block-types/Html'); - -const block = { - type: 'html', - data: { - html: '

This is an html

', - }, - sidebar: undefined, -}; - -describe('Html', () => { - it('should display innerHtml', () => { - const htmlInput = shallow(); - expect(htmlInput.find('.magic-block-html')).toHaveLength(1); - expect(htmlInput.html()).toBe('

This is an html

'); - }); -}); diff --git a/packages/api-explorer/__tests__/block-types/Image.test.jsx b/packages/api-explorer/__tests__/block-types/Image.test.jsx deleted file mode 100644 index 0b9ae6e9c..000000000 --- a/packages/api-explorer/__tests__/block-types/Image.test.jsx +++ /dev/null @@ -1,60 +0,0 @@ -const React = require('react'); -const { shallow } = require('enzyme'); -const Image = require('../../src/block-types/Image'); - -describe('Image', () => { - it('Image has a tag with property href set to url', () => { - const block = { - type: 'image', - data: { - images: [ - { - image: [ - 'https://files.readme.io/924824e-fullsizeoutput_314.jpeg', - 'fullsizeoutput_314.jpeg', - 640, - 1136, - '#c8b396', - ], - }, - ], - }, - sidebar: undefined, - }; - const imageInput = shallow(); - - expect(imageInput.find('a').prop('href')).toBe( - 'https://files.readme.io/924824e-fullsizeoutput_314.jpeg', - ); - }); - - it('Image will render caption if given in props', () => { - const block = { - type: 'image', - data: { - images: [ - { - image: [ - 'https://files.readme.io/924824e-fullsizeoutput_314.jpeg', - 'fullsizeoutput_314.jpeg', - 640, - 1136, - '#c8b396', - ], - caption: 'doggo', - }, - ], - }, - sidebar: undefined, - }; - - const imageInput = shallow(); - - expect( - imageInput - .find('figcaption') - .render() - .text(), - ).toBe('doggo'); - }); -}); diff --git a/packages/api-explorer/__tests__/block-types/Parameters.test.jsx b/packages/api-explorer/__tests__/block-types/Parameters.test.jsx deleted file mode 100644 index 61abc9e3f..000000000 --- a/packages/api-explorer/__tests__/block-types/Parameters.test.jsx +++ /dev/null @@ -1,29 +0,0 @@ -const React = require('react'); -const { shallow } = require('enzyme'); -const Parameters = require('../../src/block-types/Parameters'); - -describe('Parameters', () => { - it('Parameters will render text in table', () => { - const block = { - type: 'parameters', - sidebar: undefined, - data: { - cols: 1, - rows: 1, - data: { - '0-0': 'arbitrary', - 'h-0': 'test', - }, - }, - }; - - const parametersInput = shallow(); - expect(parametersInput.find('div.th').text()).toBe('test'); - expect( - parametersInput - .find('div.td') - .render() - .text(), - ).toBe('arbitrary'); - }); -}); diff --git a/packages/api-explorer/__tests__/block-types/TextArea.test.jsx b/packages/api-explorer/__tests__/block-types/TextArea.test.jsx deleted file mode 100644 index 1d1764f69..000000000 --- a/packages/api-explorer/__tests__/block-types/TextArea.test.jsx +++ /dev/null @@ -1,14 +0,0 @@ -const React = require('react'); -const { shallow } = require('enzyme'); -const TextArea = require('../../src/block-types/TextArea'); - -describe('TextArea', () => { - it('Text area will output text', () => { - const block = { - type: 'textarea', - text: 'this is text', - }; - const textArea = shallow(