[ { "path": ".editorconfig", "content": "root = true\n\n[*]\ncharset = utf-8\nend_of_line = lf\nindent_size = 2\nindent_style = space\ninsert_final_newline = true\ntrim_trailing_whitespace = true\n" }, { "path": ".eslintignore", "content": ".next\ncoverage\nlib\nnode_modules\nout\n" }, { "path": ".eslintrc.js", "content": "const path = require('path')\nconst { workspaces } = require('./package.json')\n\nmodule.exports = {\n root: true,\n env: {\n browser: true,\n node: true,\n es6: true,\n },\n extends: ['eslint:recommended', 'plugin:import/recommended', 'prettier'],\n rules: {\n // eslint-plugin-import cannot parse exports field in package.json.\n // https://github.com/import-js/eslint-plugin-import/issues/1810\n 'import/no-unresolved': ['error', { ignore: ['^swiper'] }],\n 'import/order': ['error', { alphabetize: { order: 'asc' } }],\n },\n overrides: [\n {\n files: ['**/*.ts', '**/*.tsx'],\n parser: '@typescript-eslint/parser',\n plugins: ['@typescript-eslint'],\n extends: [\n 'plugin:@typescript-eslint/recommended',\n 'plugin:import/typescript',\n 'prettier',\n ],\n rules: {\n '@typescript-eslint/no-explicit-any': 'off',\n '@typescript-eslint/explicit-function-return-type': 'off',\n '@typescript-eslint/explicit-module-boundary-types': 'off',\n },\n settings: {\n 'import/resolver': {\n typescript: {\n project: ['', ...workspaces].map((dir) =>\n path.join(dir, 'tsconfig.json')\n ),\n },\n },\n },\n },\n ],\n}\n" }, { "path": ".github/dependabot.yml", "content": "version: 2\n\nupdates:\n - package-ecosystem: npm\n directory: '/'\n reviewers:\n - 'marp-team/maintainers'\n schedule:\n interval: daily\n allow:\n - dependency-name: '@marp-team/*'\n versioning-strategy: increase\n\n - package-ecosystem: github-actions\n directory: '/'\n reviewers:\n - 'marp-team/maintainers'\n schedule:\n interval: weekly\n # versioning-strategy: increase-if-necessary\n open-pull-requests-limit: 0 # Dependabot does not allow relaxed versioning :(\n" }, { "path": ".github/workflows/test.yml", "content": "name: Test\n\non:\n - pull_request\n - push\n\nenv:\n CACHE_PREFIX: v1\n YARN_VERSION: '^1.22.4'\n\njobs:\n test:\n runs-on: ubuntu-latest\n steps:\n - uses: actions/checkout@v3\n\n - uses: actions/setup-node@v3\n with:\n node-version-file: '.nvmrc'\n\n - name: Install yarn\n id: yarn\n run: |\n cd $HOME && yarn policies set-version $YARN_VERSION\n echo \"::set-output name=cache_dir::$(yarn cache dir)\"\n\n - uses: actions/cache@v3\n with:\n path: ${{ steps.yarn.outputs.cache_dir }}\n key: yarn_cache-${{ env.CACHE_PREFIX }}-${{ hashFiles('**/yarn.lock') }}\n restore-keys: yarn_cache-${{ env.CACHE_PREFIX }}-\n\n - run: yarn install\n - run: yarn audit\n\n - name: Prettier formatting\n run: yarn check:format\n\n - name: ESLint\n run: yarn lint:js\n\n - name: TypeScript type checking\n run: yarn check:ts\n" }, { "path": ".gitignore", "content": "# Created by https://www.toptal.com/developers/gitignore/api/vim,node,linux,emacs,macos,windows,intellij,sublimetext,visualstudiocode\n# Edit at https://www.toptal.com/developers/gitignore?templates=vim,node,linux,emacs,macos,windows,intellij,sublimetext,visualstudiocode\n\n### Emacs ###\n# -*- mode: gitignore; -*-\n*~\n\\#*\\#\n/.emacs.desktop\n/.emacs.desktop.lock\n*.elc\nauto-save-list\ntramp\n.\\#*\n\n# Org-mode\n.org-id-locations\n*_archive\n\n# flymake-mode\n*_flymake.*\n\n# eshell files\n/eshell/history\n/eshell/lastdir\n\n# elpa packages\n/elpa/\n\n# reftex files\n*.rel\n\n# AUCTeX auto folder\n/auto/\n\n# cask packages\n.cask/\ndist/\n\n# Flycheck\nflycheck_*.el\n\n# server auth directory\n/server/\n\n# projectiles files\n.projectile\n\n# directory configuration\n.dir-locals.el\n\n# network security\n/network-security.data\n\n\n### Intellij ###\n# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio, WebStorm and Rider\n# Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839\n\n# User-specific stuff\n.idea/**/workspace.xml\n.idea/**/tasks.xml\n.idea/**/usage.statistics.xml\n.idea/**/dictionaries\n.idea/**/shelf\n\n# AWS User-specific\n.idea/**/aws.xml\n\n# Generated files\n.idea/**/contentModel.xml\n\n# Sensitive or high-churn files\n.idea/**/dataSources/\n.idea/**/dataSources.ids\n.idea/**/dataSources.local.xml\n.idea/**/sqlDataSources.xml\n.idea/**/dynamic.xml\n.idea/**/uiDesigner.xml\n.idea/**/dbnavigator.xml\n\n# Gradle\n.idea/**/gradle.xml\n.idea/**/libraries\n\n# Gradle and Maven with auto-import\n# When using Gradle or Maven with auto-import, you should exclude module files,\n# since they will be recreated, and may cause churn. Uncomment if using\n# auto-import.\n# .idea/artifacts\n# .idea/compiler.xml\n# .idea/jarRepositories.xml\n# .idea/modules.xml\n# .idea/*.iml\n# .idea/modules\n# *.iml\n# *.ipr\n\n# CMake\ncmake-build-*/\n\n# Mongo Explorer plugin\n.idea/**/mongoSettings.xml\n\n# File-based project format\n*.iws\n\n# IntelliJ\nout/\n\n# mpeltonen/sbt-idea plugin\n.idea_modules/\n\n# JIRA plugin\natlassian-ide-plugin.xml\n\n# Cursive Clojure plugin\n.idea/replstate.xml\n\n# SonarLint plugin\n.idea/sonarlint/\n\n# Crashlytics plugin (for Android Studio and IntelliJ)\ncom_crashlytics_export_strings.xml\ncrashlytics.properties\ncrashlytics-build.properties\nfabric.properties\n\n# Editor-based Rest Client\n.idea/httpRequests\n\n# Android studio 3.1+ serialized cache file\n.idea/caches/build_file_checksums.ser\n\n### Intellij Patch ###\n# Comment Reason: https://github.com/joeblau/gitignore.io/issues/186#issuecomment-215987721\n\n# *.iml\n# modules.xml\n# .idea/misc.xml\n# *.ipr\n\n# Sonarlint plugin\n# https://plugins.jetbrains.com/plugin/7973-sonarlint\n.idea/**/sonarlint/\n\n# SonarQube Plugin\n# https://plugins.jetbrains.com/plugin/7238-sonarqube-community-plugin\n.idea/**/sonarIssues.xml\n\n# Markdown Navigator plugin\n# https://plugins.jetbrains.com/plugin/7896-markdown-navigator-enhanced\n.idea/**/markdown-navigator.xml\n.idea/**/markdown-navigator-enh.xml\n.idea/**/markdown-navigator/\n\n# Cache file creation bug\n# See https://youtrack.jetbrains.com/issue/JBR-2257\n.idea/$CACHE_FILE$\n\n# CodeStream plugin\n# https://plugins.jetbrains.com/plugin/12206-codestream\n.idea/codestream.xml\n\n# Azure Toolkit for IntelliJ plugin\n# https://plugins.jetbrains.com/plugin/8053-azure-toolkit-for-intellij\n.idea/**/azureSettings.xml\n\n### Linux ###\n\n# temporary files which can be created if a process still has a handle open of a deleted file\n.fuse_hidden*\n\n# KDE directory preferences\n.directory\n\n# Linux trash folder which might appear on any partition or disk\n.Trash-*\n\n# .nfs files are created when an open file is removed but is still being accessed\n.nfs*\n\n### macOS ###\n# General\n.DS_Store\n.AppleDouble\n.LSOverride\n\n# Icon must end with two \\r\nIcon\n\n\n# Thumbnails\n._*\n\n# Files that might appear in the root of a volume\n.DocumentRevisions-V100\n.fseventsd\n.Spotlight-V100\n.TemporaryItems\n.Trashes\n.VolumeIcon.icns\n.com.apple.timemachine.donotpresent\n\n# Directories potentially created on remote AFP share\n.AppleDB\n.AppleDesktop\nNetwork Trash Folder\nTemporary Items\n.apdisk\n\n### macOS Patch ###\n# iCloud generated files\n*.icloud\n\n### Node ###\n# Logs\nlogs\n*.log\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\nlerna-debug.log*\n.pnpm-debug.log*\n\n# Diagnostic reports (https://nodejs.org/api/report.html)\nreport.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json\n\n# Runtime data\npids\n*.pid\n*.seed\n*.pid.lock\n\n# Directory for instrumented libs generated by jscoverage/JSCover\nlib-cov\n\n# Coverage directory used by tools like istanbul\ncoverage\n*.lcov\n\n# nyc test coverage\n.nyc_output\n\n# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)\n.grunt\n\n# Bower dependency directory (https://bower.io/)\nbower_components\n\n# node-waf configuration\n.lock-wscript\n\n# Compiled binary addons (https://nodejs.org/api/addons.html)\nbuild/Release\n\n# Dependency directories\nnode_modules/\njspm_packages/\n\n# Snowpack dependency directory (https://snowpack.dev/)\nweb_modules/\n\n# TypeScript cache\n*.tsbuildinfo\n\n# Optional npm cache directory\n.npm\n\n# Optional eslint cache\n.eslintcache\n\n# Optional stylelint cache\n.stylelintcache\n\n# Microbundle cache\n.rpt2_cache/\n.rts2_cache_cjs/\n.rts2_cache_es/\n.rts2_cache_umd/\n\n# Optional REPL history\n.node_repl_history\n\n# Output of 'npm pack'\n*.tgz\n\n# Yarn Integrity file\n.yarn-integrity\n\n# dotenv environment variable files\n.env\n.env.development.local\n.env.test.local\n.env.production.local\n.env.local\n\n# parcel-bundler cache (https://parceljs.org/)\n.cache\n.parcel-cache\n\n# Next.js build output\n.next\nout\n\n# Nuxt.js build / generate output\n.nuxt\ndist\n\n# Gatsby files\n.cache/\n# Comment in the public line in if your project uses Gatsby and not Next.js\n# https://nextjs.org/blog/next-9-1#public-directory-support\n# public\n\n# vuepress build output\n.vuepress/dist\n\n# vuepress v2.x temp and cache directory\n.temp\n\n# Docusaurus cache and generated files\n.docusaurus\n\n# Serverless directories\n.serverless/\n\n# FuseBox cache\n.fusebox/\n\n# DynamoDB Local files\n.dynamodb/\n\n# TernJS port file\n.tern-port\n\n# Stores VSCode versions used for testing VSCode extensions\n.vscode-test\n\n# yarn v2\n.yarn/cache\n.yarn/unplugged\n.yarn/build-state.yml\n.yarn/install-state.gz\n.pnp.*\n\n### Node Patch ###\n# Serverless Webpack directories\n.webpack/\n\n# Optional stylelint cache\n\n# SvelteKit build / generate output\n.svelte-kit\n\n### SublimeText ###\n# Cache files for Sublime Text\n*.tmlanguage.cache\n*.tmPreferences.cache\n*.stTheme.cache\n\n# Workspace files are user-specific\n*.sublime-workspace\n\n# Project files should be checked into the repository, unless a significant\n# proportion of contributors will probably not be using Sublime Text\n# *.sublime-project\n\n# SFTP configuration file\nsftp-config.json\nsftp-config-alt*.json\n\n# Package control specific files\nPackage Control.last-run\nPackage Control.ca-list\nPackage Control.ca-bundle\nPackage Control.system-ca-bundle\nPackage Control.cache/\nPackage Control.ca-certs/\nPackage Control.merged-ca-bundle\nPackage Control.user-ca-bundle\noscrypto-ca-bundle.crt\nbh_unicode_properties.cache\n\n# Sublime-github package stores a github token in this file\n# https://packagecontrol.io/packages/sublime-github\nGitHub.sublime-settings\n\n### Vim ###\n# Swap\n[._]*.s[a-v][a-z]\n!*.svg # comment out if you don't need vector files\n[._]*.sw[a-p]\n[._]s[a-rt-v][a-z]\n[._]ss[a-gi-z]\n[._]sw[a-p]\n\n# Session\nSession.vim\nSessionx.vim\n\n# Temporary\n.netrwhist\n# Auto-generated tag files\ntags\n# Persistent undo\n[._]*.un~\n\n### VisualStudioCode ###\n.vscode/*\n!.vscode/settings.json\n!.vscode/tasks.json\n!.vscode/launch.json\n!.vscode/extensions.json\n!.vscode/*.code-snippets\n\n# Local History for Visual Studio Code\n.history/\n\n# Built Visual Studio Code Extensions\n*.vsix\n\n### VisualStudioCode Patch ###\n# Ignore all local history of files\n.history\n.ionide\n\n# Support for Project snippet scope\n.vscode/*.code-snippets\n\n# Ignore code-workspaces\n*.code-workspace\n\n### Windows ###\n# Windows thumbnail cache files\nThumbs.db\nThumbs.db:encryptable\nehthumbs.db\nehthumbs_vista.db\n\n# Dump file\n*.stackdump\n\n# Folder config file\n[Dd]esktop.ini\n\n# Recycle Bin used on file shares\n$RECYCLE.BIN/\n\n# Windows Installer files\n*.cab\n*.msi\n*.msix\n*.msm\n*.msp\n\n# Windows shortcuts\n*.lnk\n\n# End of https://www.toptal.com/developers/gitignore/api/vim,node,linux,emacs,macos,windows,intellij,sublimetext,visualstudiocode\n" }, { "path": ".nvmrc", "content": "18.18.2\n" }, { "path": ".prettierignore", "content": ".next\nnode_modules\nout\n" }, { "path": "LICENSE", "content": "MIT License\n\nCopyright (c) 2018- Marp team (marp-team@marp.app)\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n" }, { "path": "README.md", "content": "
\n

\n \"Marp\"\n \"Marp\"\n

\n

\n Marp: Markdown Presentation Ecosystem\n

\n
\n\n**Marp** is the ecosystem to write your presentation with plain Markdown.\n\n
\n\n### [🌐 Website ▶︎](https://marp.app) | [💬 Discussion forum ▶︎](https://github.com/marp-team/marp/discussions) | [😎 Awesome list ▶︎](https://github.com/marp-team/awesome-marp)\n\n
\n\n## Marp family\n\nOur project is spread over many repos in order to focus on a limited scope per repository.\n\nThis repo (**[marp-team/marp][marp]**) is an entrance to the Marp family, and places [our website](https://marp.app/) in `/website`.\n\n### Framework / Core\n\n| Name | Description | Release |\n| -------------------------: | :------------------------------------------------------------------------------------------ | :-------------------------------------------------------- |\n| **[Marpit]** | The skinny framework for creating slide deck from Markdown. ([marpit.marp.app]) | [![@marp-team/marpit][badge-marpit]][marpit-npm] |\n| **[Marp Core][marp-core]** | The core of Marp converter with practical features and [built-in themes][marp-core-themes]. | [![@marp-team/marp-core][badge-marp-core]][marp-core-npm] |\n\n### Apps\n\n| Name | Description | Release |\n| -----------------------: | :----------------------------------------------------------------------------------------------- | :----------------------------------------------------- |\n| **[Marp CLI][marp-cli]** | [Marp Core][marp-core] / [Marpit]'s CLI interface to convert into HTML, PDF, PPTX, and image(s). | [![@marp-team/marp-cli][badge-marp-cli]][marp-cli-npm] |\n\n### Integrations\n\n| Name | Description | Release |\n| ----------------------------------: | :-------------------------------------------------------------------------------- | :---------------------------------------------------------- |\n| **[Marp for VS Code][marp-vscode]** | A [VS Code][vscode] extension to preview the slide deck written in Marp Markdown. | [![VS Marketplace][badge-marp-vscode]][marp-vscode-release] |\n\n
\nSee outdated/inactive projects...
\n\n| Name | Description | Release |\n| -----------------------: | :--------------------------------------------------------------- | :----------------------------------------------------------- |\n| [Marp Web][marp-web] | The Web interface of Marp based on [PWA] and [Preact] framework. | [![tech demo][badge-marp-web]][marp-web-site] |\n| [Marp React][marp-react] | Marp renderer component for [React]. | [![@marp-team/marp-react][badge-marp-react]][marp-react-npm] |\n| [Marp Vue][marp-vue] | Marp renderer component for [Vue]. | [![@marp-team/marp-vue][badge-marp-vue]][marp-vue-npm] |\n\nAnd there is a gravesite of classic Marp app in https://github.com/yhatt/marp. :ghost:\n\n[marp-web]: https://github.com/marp-team/marp-web\n[marp-react]: https://github.com/marp-team/marp-react\n[marp-vue]: https://github.com/marp-team/marp-vue\n[pwa]: https://en.wikipedia.org/wiki/Progressive_Web_Apps\n[preact]: https://preactjs.com/\n[react]: https://reactjs.org/\n[vue]: https://vuejs.org/\n[marp-web-site]: https://web.marp.app/\n[marp-react-npm]: https://www.npmjs.com/package/@marp-team/marp-react\n[marp-vue-npm]: https://www.npmjs.com/package/@marp-team/marp-vue\n[badge-marp-web]: https://img.shields.io/badge/%E2%80%8B-tech%20demo-%230288d1.svg?style=flat-square&logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAAUUlEQVQokWNgGD6AqePif3Sx9B2PMcQwNKFrTN/x+D9ejTBNyBphmnBqRNYE04isCatGdE1MHRf/o2vC0IhNE1PaXPwacWnCqxGfJoI2Dn4AAN0ZrMM1VUFvAAAAAElFTkSuQmCC\n[badge-marp-react]: https://img.shields.io/npm/v/@marp-team/marp-react.svg?style=flat-square&logo=npm\n[badge-marp-vue]: https://img.shields.io/npm/v/@marp-team/marp-vue.svg?style=flat-square&logo=npm\n\n
\n\n[yhatt/marp]: https://github.com/yhatt/marp\n[marp]: https://github.com/marp-team/marp\n[marpit]: https://github.com/marp-team/marpit\n[marp-core]: https://github.com/marp-team/marp-core\n[marp-core-themes]: https://github.com/marp-team/marp-core/tree/main/themes\n[marp-cli]: https://github.com/marp-team/marp-cli\n[marp-vscode]: https://github.com/marp-team/marp-vscode\n[vscode]: https://code.visualstudio.com/\n[marpit.marp.app]: https://marpit.marp.app/\n[marpit-npm]: https://www.npmjs.com/package/@marp-team/marpit\n[marp-core-npm]: https://www.npmjs.com/package/@marp-team/marp-core\n[marp-cli-npm]: https://www.npmjs.com/package/@marp-team/marp-cli\n[marp-vscode-release]: https://marketplace.visualstudio.com/items?itemName=marp-team.marp-vscode\n[badge-marpit]: https://img.shields.io/npm/v/@marp-team/marpit.svg?style=flat-square&logo=npm\n[badge-marp-core]: https://img.shields.io/npm/v/@marp-team/marp-core.svg?style=flat-square&logo=npm\n[badge-marp-cli]: https://img.shields.io/npm/v/@marp-team/marp-cli.svg?style=flat-square&logo=npm\n[badge-marp-vscode]: https://img.shields.io/visual-studio-marketplace/v/marp-team.marp-vscode.svg?style=flat-square&logo=visual-studio-code&label=Marketplace\n\n## Ecosystem\n\nMarp ecosystem has a lot of cool stuffs for making awesome presentation. Check out **[the awesome list of Marp](https://github.com/marp-team/awesome-marp)**. 😎\n\n## Contributing\n\nMarp and sub-projects are following the [contributing guideline of marp-team][contributing]. Please read this before starting work in our projects.\n\n[contributing]: https://github.com/marp-team/.github/blob/master/CONTRIBUTING.md\n\n## Author\n\nManaged by [@marp-team](https://github.com/marp-team).\n\n- Yuki Hattori ([@yhatt](https://github.com/yhatt))\n\n## Sponsors\n\nWe are supported by them! Thanks for our sponsors! :heart:\n\n\n\n### Organization sponsors\n\n\n\n

\n \"@markslides\"\n

\n\n\n\n\n### Personal sponsors\n\n\n\n

\n \"Personal\n

\n\n> Do you want to sponsor [the member of Marp team](https://github.com/orgs/marp-team/people)? See [GitHub Sponsors](https://github.com/sponsors) profile(s) from \"♥︎ Sponsor\" button [at the top of repository](https://github.com/marp-team/marp).\n\n## License\n\n[MIT License](LICENSE)\n" }, { "path": "netlify.toml", "content": "[build]\n publish = \"website/out\"\n command = \"yarn workspace @marp-team/marp-website export\"\n\n[[headers]]\n for = \"/*\"\n [headers.values]\n Permissions-Policy = \"interest-cohort=()\"\n" }, { "path": "package.json", "content": "{\n \"name\": \"@marp-team/marp\",\n \"description\": \"The entrance repository of Markdown presentation ecosystem\",\n \"private\": true,\n \"license\": \"MIT\",\n \"author\": {\n \"name\": \"Marp team\",\n \"url\": \"https://github.com/marp-team\"\n },\n \"contributors\": [\n {\n \"name\": \"Yuki Hattori\",\n \"url\": \"https://github.com/yhatt\"\n }\n ],\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"https://github.com/marp-team/marp\"\n },\n \"workspaces\": [\n \"website\"\n ],\n \"prettier\": {\n \"semi\": false,\n \"singleQuote\": true\n },\n \"scripts\": {\n \"check:format\": \"yarn -s format -c\",\n \"check:ts\": \"yarn lage check:ts\",\n \"format:write\": \"yarn -s format --write\",\n \"format\": \"prettier \\\"**/*.{css,js,jsx,json,md,mdx,scss,ts,tsx,yaml,yml}\\\"\",\n \"lint:js\": \"eslint --report-unused-disable-directives --cache .\",\n \"website\": \"yarn workspace @marp-team/marp-website dev\"\n },\n \"devDependencies\": {\n \"@tsconfig/recommended\": \"^1.0.1\",\n \"@types/node\": \"~18.11.18\",\n \"@typescript-eslint/eslint-plugin\": \"^5.47.1\",\n \"@typescript-eslint/parser\": \"^5.47.1\",\n \"eslint\": \"^8.30.0\",\n \"eslint-config-prettier\": \"^8.3.0\",\n \"eslint-import-resolver-typescript\": \"^3.5.2\",\n \"eslint-plugin-import\": \"^2.25.4\",\n \"lage\": \"^1.9.6\",\n \"prettier\": \"^2.8.1\",\n \"typescript\": \"^4.9.4\"\n },\n \"resolutions\": {\n \"json5\": \"^2.2.2\"\n }\n}\n" }, { "path": "tsconfig.json", "content": "{\n \"extends\": \"@tsconfig/recommended/tsconfig.json\",\n \"compilerOptions\": {\n \"lib\": [\"es2015\", \"dom\"],\n \"noImplicitAny\": false,\n \"resolveJsonModule\": true,\n \"strict\": true\n }\n}\n" }, { "path": "website/.eslintrc.js", "content": "const path = require('path')\n\nmodule.exports = {\n extends: ['next', 'prettier'],\n rules: {\n '@next/next/no-html-link-for-pages': [\n 'error',\n path.join(__dirname, 'pages'),\n ],\n\n // Marp website is completely static. Automatic Image Optimization by Next.js requires a server for on-demand conversion.\n '@next/next/no-img-element': 'off',\n },\n}\n" }, { "path": "website/assets.d.ts", "content": "declare module '*.yaml' {\n const yaml: any\n export = yaml\n}\n" }, { "path": "website/babel.config.js", "content": "const path = require('path')\n\nmodule.exports = {\n presets: [\n [\n 'next/babel',\n {\n 'styled-jsx': {\n plugins: [\n [\n require.resolve('styled-jsx-plugin-postcss'),\n { path: path.resolve(__dirname, './postcss.config.js') },\n ],\n ],\n },\n },\n ],\n ],\n}\n" }, { "path": "website/blog/202205-ecosystem-update.md", "content": "---\ntitle: 'Ecosystem update: Marp Core v3 & Slide transitions in CLI v2'\ndate: 2022-05-26\ndescription: Introduce a stable release of Marp Core v3, and updated CLI v2 with an entirely new slide transition experiment.\nauthor: Yuki Hattori\ngithub: yhatt\nimage: /og-images/202205-ecosystem-update.jpg\n---\n\nWe are so excited to introduce a stable release of **[Marp Core](https://github.com/marp-team/marp-core) v3**, and **[Marp CLI](https://github.com/marp-team/marp-cli) v2** update with [an entirely new slide transition experiment](#slide-transition-experiment).\n\n- **[Marp Core v3](#marp-core-v3)**: MathJax rendering as default, updated `default` theme, and new components for auto-scaling.\n- **[Marp CLI v2](#marp-cli-v2)**: Bundled core v3, and [brand-new slide transition experiment](#slide-transition-experiment) with 33 built-in effects + CSS custom transitions.\n\n\n\n# Marp Core v3\n\n[We had released Marp Core v3.0.0 as a release candidate in November 2021.](https://github.com/marp-team/marp-core/releases/tag/v3.0.0) For a half year, it had been available in the `next` tag as an opt-in engine of Marp CLI, and had accepted feedback from the community.\n\nThis month [v3.2.0](https://github.com/marp-team/marp-core/releases/tag/v3.2.0) has become a stable release, and **we are starting work to make v3 core the default in downstream Marp tools gradually.**\n\nAn updated Marp Core v3 has some major changes, but we also have worked to keep backward compatibility in many existing slides. Most slide authors should not be concerned about regressions as long as your tweaks to the slide theme are not complicated.\n\nIf you are a theme author, you may have to modify some of the styles. This update includes a brand-new auto scaling component, the change of `default` theme caused by the update of [`github-markdown-css`](https://github.com/sindresorhus/github-markdown-css), and so on.\n\nEven so, you should not too worry: We worked to v3 core to reduce friction between Marp's CSS and common CSS, so I think the complex part of our theming system (e.g. styling auto-scaled element) must be easier to understand than v2.\n\n## Notable changes\n\n### Drop support for End-of-Life Node.js\n\nFirst, Marp Core v3 has dropped support for end-of-life Node.js 10.\n\nWe have supported EoL Node.js v12 yet, but continuous support may not guarantee depending on the support status of dependency modules. We recommend following up on [the active LTS Node.js](https://nodejs.org/).\n\n> Check out https://endoflife.date/nodejs to know which version of Node.js is EoL.\n\n### MathJax is a default typesetting library for math\n\n[katex]: https://katex.org/\n[mathjax]: https://www.mathjax.org/\n\nMarp Core v3 has changed the default library for rendering math, from [KaTeX] to [MathJax].\n\nMarp had used [KaTeX] as a default library for long years for taking better performance. But currently, this opinion has become the past thinking with the advent of MathJax 3. [See this interesting insight.](https://groups.google.com/g/mathjax-users/c/aboJLMb50uQ/m/Y77FexF_AwAJ)\n\nAnd some incompatibilities of KaTeX with Marp Core's auto scaling feature that are hard to fix had given us a headache. ([marp-team/marp-core#159](https://github.com/marp-team/marp-core/issues/159), [marp-team/marp-core#236](https://github.com/marp-team/marp-core/issues/236))\n\nMathJax implementation in Marp Core has more reliable rendering than KaTeX. In addition, it also has more TeX function supports, and no network is required to show.\n\nNow a lot of Markdown flavors have adopted MathJax for math typesetting (e.g. [GitHub](https://github.blog/2022-05-19-math-support-in-markdown/)), and we expect Marp Markdown would get higher compatibility in several Markdown services.\n\n#### `math` global directive\n\nIf your Markdown is not yet ready to migrate math typesettings into MathJax, you can continue to use KaTeX as a math typesetting library by setting [`math` global directive](https://github.com/marp-team/marp-core#math-global-directive) as `katex`.\n\n```markdown\n---\nmath: katex\n---\n\nContinue to use KaTeX: $ax^2+bc+c$\n```\n\nWe have no plans to remove KaTeX integration for a while. So you can keep rendering math with KaTeX if you're using KaTeX specific syntaxes or met rendering performance issues in MathJax.\n\n> For smooth migration of exist slides to v3, Marp for VS Code is [annotating to math use without `math` global directive](https://github.com/marp-team/marp-vscode#diagnostics) since a year ago.\n\n### Renewed auto-scaling component\n\nMarp Core has a tiny runtime script to activate element auto-scaling for a code block, math block, and [fitting header `# header`](https://github.com/marp-team/marp-core#fitting-header). v3 has updated auto scaling logic into [Web Components](https://developer.mozilla.org/docs/Web/Web_Components) based, to improve output lucidity and compatibility with some CSS selectors.\n\nThis update does not change the actual auto-scaling behavior from v2, so most Markdown slide authors should not need to take care of that. But if you have a custom theme that was styled to auto-scaling elements, you should review and modify CSS declarations in your theme to match with v3.\n\nPlease refer to the pull request **[marp-team/marp-core#263](https://github.com/marp-team/marp-core/pull/263)** for details of auto-scaling components.\n\n### Updated `default` theme\n\nTo provide a familiar Markdown style to users as default, Marp Core `default` theme is based on [GitHub's Markdown CSS](https://github.com/sindresorhus/github-markdown-css).\n\nThe latest Marp Core has included the following updates about `default` theme:\n\n- Updated color schemes based on the latest [github-markdown-css v5](https://github.com/sindresorhus/github-markdown-css)\n- Match colors for code highlight with GitHub style\n- Allow color customization through CSS variables ([See theme docs](https://github.com/marp-team/marp-core/tree/main/themes#custom-color-css-variables))\n\n````markdown:marp\n\n\n\n# This is a new `default` theme\n\n```markdown\n\n\n# This is a new `default` theme\n```\n\n---\n\n\n\n# Updated `invert` color scheme\n\nbased on GitHub dark mode\n\n```markdown\n\n```\n\n````\n\n### URL without HTTP(S) scheme does no longer auto-linkify\n\nMarp Core up to v2 had detected URL-like strings and converted them to hyperlinks automatically. However, that was too fuzzy and often brought linkify in not intended words, such as \"[Amazon.com](https://amazon.com/)\" and \"[ML.NET](https://dotnet.microsoft.com/apps/machinelearning-ai/ml-dotnet)\".\n\nBut there are no more fuzzy links in v3! Now auto link feature requires the URL string with `https://` or `http://` scheme.\n\nPlease make a Markdown link `[Amazon.com](https://amazon.com/)` explicitly if you want the hyperlink in previously auto-linked words.\n\n# Marp CLI v2\n\nAccording to the time to become core v3 stable, we also worked on **[a major update of Marp CLI](https://github.com/marp-team/marp-cli/releases/tag/v2.0.0)** to bundle a new core.\n\nThere are no major changes in the general use of Marp CLI, and I believe your CLI workflow would never break by this update in most cases.\n\nSo what feature is a \"major\" update of CLI? [_Perhaps you may have interested in a hidden gem..._ 💎](#slide-transition-experiment)\n\n## Notable changes\n\n### Required Node.js v14 and later\n\nThe new release of Marp CLI is required **the latest Node.js v14 and later**, because depending modules such as Puppeteer (for PDF/PPTX generation) were dropped support for EoL Node.js versions v12 and older.\n\n### Bundled Marp Core v3\n\nAs described earlier, Marp CLI v2 has bundled an updated Marp Core v3.2.0 as a core engine.\n\n```bash\n$ marp --version\n@marp-team/marp-cli v2.0.0 (w/ @marp-team/marp-core v3.2.0)\n```\n\n###### Continue to use v2 core in Marp CLI\n\nWe recommend getting ready for using the updated v3 core, but Marp CLI also can stick to the v2 core by installing `@marp-team/marp-core@^2` to your project individually.\n\n```bash\nnpm i --save-dev @marp-team/marp-cli @marp-team/marp-core@^2\nnpx marp ./your-markdown.md\n```\n\nIt's useful when your Markdown slide files are not ready for v3 core. But please keep in mind we would hardly provide more updates to v2 core, and **continuous use may bring a risk of unpatched security issues.**\n\n# Slide transitions\n\nA really loving part of this CLI update for me is **[a brand-new slide transition in `bespoke` HTML template.](https://github.com/marp-team/marp-cli/issues/447)**\n\nWe had started testing experimental slide transition effects since [Marp CLI v1.4.0](https://github.com/marp-team/marp-cli/releases/tag/v1.4.0) (Aug 2021). `--bespoke.transition` CLI option had been working well, but not so practical compared to the common presentation tools.\n\nAs a result of catching up on the new spec of [View Transitions API proposal][view transitions api] in Marp CLI v2, I'm so excited to provide powerful transition features that are in no other Markdown slide tools, such as CSS custom transition effects and morphing animations!\n\n[view transitions api]: https://www.w3.org/TR/css-view-transitions-1/\n\n> The slide transitions feature has made stable in v2.4.0. You can dive into all about of transitions at [the documentation of Marp CLI transitions][transition-docs].\n\n[transition-docs]: https://github.com/marp-team/marp-cli/blob/main/docs/bespoke-transitions/README.md\n\n## Quick look\n\n![Marp CLI transition showcase poster=/assets/202205-ecosystem-update/transition-showcase-poster.jpg controls](https://user-images.githubusercontent.com/3993388/169697466-283dd2f2-b6e5-4b33-86d4-b10cc0a6c3e9.mp4)\n\n- **[33 built-in transitions](https://github.com/marp-team/marp-cli/blob/main/docs/bespoke-transitions/README.md#built-in-transitions)**: Marp CLI provides a lot of transition effects out of the box.\n- **[Define custom transitions via CSS](https://github.com/marp-team/marp-cli/blob/main/docs/bespoke-transitions/README.md#custom-transitions)**: Markdown author and theme designer can define the custom transition through `@keyframes` declaration in CSS.\n- **[Morphing animations](https://github.com/marp-team/marp-cli/blob/main/docs/bespoke-transitions/README.md#morphing-animations)**: [`view-transition-name` CSS property](https://www.w3.org/TR/css-view-transitions-1/#view-transition-name-prop) supplied by View Transition API helps to make morphing animation while transition.\n\n## Usage\n\nThe slide transitions in HTML output can opt in and out through `--bespoke.transition` CLI option. _It is only working in the browser that supports [View Transitions API], such as Chrome/Chromium 110 and later._\n\nThe `--preview` CLI option is helpful see transition effects surely. Try this in Marp CLI v2.4.0+ to open a preview window for the transition showcase:\n\n```bash\ncurl -o ./showcase.md https://gist.githubusercontent.com/yhatt/d9e86ee53eb8816aaf9c996e773b6f82/raw/transition-showcase.md\nmarp --preview ./showcase.md\n```\n\n## Showcase\n\nYou can see online demo slides about Marp CLI brand new transitions! See them in the browser that supports [View Transitions API].\n\n- **[Marp CLI page transition showcase](https://marp-cli-page-transitions.glitch.me/)**: The showcase of built-in transitions\n- **[Custom transitions example](https://marp-cli-page-transitions.glitch.me/custom.html)**: Some examples and ideas about custom transitions\n- **[Transition with morphing animation](https://marp-cli-page-transitions.glitch.me/morph.html)**: An example of morphing animation powered by [View Transitions API].\n\n## `transition` local directive\n\nYou can set and change the kind of transition through `transition` local directive.\n\n```markdown\n---\ntransition: fade\n---\n\nFade transition with 0.5s duration\n\n---\n\n\n\nChanged the kind of transition to `cover` with 1s duration\n\n---\n\n\n\nDisabled transition for this slide\n\n---\n\nGot back to cover transition\n```\n\nEach transition has a default 0.5s duration, but you can also set custom duration by space-separated value such as ``.\n\n## Custom transition\n\nThe custom transition can define through just a few conventional [`@keyframes` at-rules](https://developer.mozilla.org/docs/Web/CSS/@keyframes) within the inline `\n```\n\n# Try Marp Next!\n\nMarp Next just focuses to build the ecosystem for Markdown slide deck with pure open source. We expect to expand Marp productivity together with open source community.\n\nWe still have stood at the beginning of the brand-new ecosystem. Are you interested to Marp team and our ecosystem? We welcome to start your contribution! See [our contributing guideline](https://github.com/marp-team/.github/blob/master/CONTRIBUTING.md) and get started!\n\n> PS. [GitHub Sponsors](https://github.com/sponsors/yhatt) is also good contribution if you want to help my working for open source.\n" }, { "path": "website/components/Button.tsx", "content": "import classNames from 'classnames'\nimport { ReactNode } from 'react'\n\nexport type ButtonProps = {\n children?: ReactNode\n color?: 'primary'\n href?: string\n outline?: boolean\n [key: string]: unknown\n}\n\nexport const Button = ({\n children,\n className,\n color,\n href,\n outline,\n ...rest\n}: ButtonProps) => {\n const Tag = href ? 'a' : 'button'\n const attrs = {\n ...rest,\n ...(Tag === 'a' ? { href, role: 'button', tabIndex: 0 } : {}),\n }\n\n return (\n \n {children}\n \n \n )\n}\n" }, { "path": "website/components/CodeBlock.tsx", "content": "/* eslint-disable react/jsx-key */\nimport classNames from 'classnames'\nimport Highlight, {\n defaultProps,\n Language,\n PrismTheme,\n} from 'prism-react-renderer'\nimport nightOwlLight from 'prism-react-renderer/themes/nightOwlLight'\nimport { useRef, useState, MouseEvent } from 'react'\nimport { Button } from 'components/Button'\n\nconst theme: PrismTheme = {\n plain: {\n ...nightOwlLight.plain,\n backgroundColor: '#f5f5f5',\n },\n styles: [\n ...nightOwlLight.styles,\n { types: ['italic'], style: { fontStyle: 'italic' } },\n { types: ['important', 'bold'], style: { fontWeight: 'bold' } },\n ],\n}\n\nexport type CodeBlockProps = {\n children: string\n copyButton?: boolean\n language: Language\n lineNumber?: boolean\n [key: string]: unknown\n}\n\nexport const CodeBlock = ({\n children,\n className,\n copyButton,\n language,\n lineNumber = false,\n ...rest\n}: CodeBlockProps) => {\n const [copied, setCopied] = useState(false)\n const copiedTimer = useRef(undefined)\n\n return (\n <>\n \n {({ className: cn, style, tokens, getLineProps, getTokenProps }) => (\n
\n \n \n
    \n {tokens.map((line, i) => {\n const lineProps = getLineProps({ line, key: i })\n\n return (\n \n {line.map((token, key) =>\n token.empty ? (\n
    \n ) : (\n \n )\n )}\n \n )\n })}\n
\n \n \n {copyButton && (\n
\n ) => {\n const tmpTextarea = document.createElement('textarea')\n tmpTextarea.value = children\n\n tmpTextarea.style.position = 'absolute'\n tmpTextarea.style.left = '0'\n tmpTextarea.style.top = '0'\n tmpTextarea.style.opacity = '0'\n tmpTextarea.style.pointerEvents = 'none'\n\n document.body.appendChild(tmpTextarea)\n tmpTextarea.select()\n\n document.execCommand('copy')\n document.body.removeChild(tmpTextarea)\n e.currentTarget.focus()\n\n // Update React state\n setCopied(true)\n\n if (copiedTimer.current !== undefined) {\n window.clearTimeout(copiedTimer.current)\n }\n\n copiedTimer.current = window.setTimeout(() => {\n copiedTimer.current = undefined\n setCopied(false)\n }, 1000)\n }}\n >\n {copied ? 'Copied!' : 'Copy'}\n \n
\n )}\n
\n )}\n \n \n \n )\n}\n" }, { "path": "website/components/Footer.tsx", "content": "import { ScrollToTop } from 'components/ScrollToTop'\n\nexport const Footer = () => (\n
\n
\n

\n Copyright © 2019-{process.env.BUILD_YEAR} Marp team. \n \n

\n \n
\n \n
\n)\n" }, { "path": "website/components/Header.tsx", "content": "import classNames from 'classnames'\nimport Link from 'next/link'\nimport MarpLogo from 'public/assets/marp-logo.svg'\n\nconst handleMouseUp = (e: React.MouseEvent) =>\n e.currentTarget.blur()\n\nexport type ItemSlug = 'docs' | 'blog'\n\nexport const Header = ({ activeItem }: { activeItem?: ItemSlug }) => (\n <>\n
\n \n \n \n Marp\n \n \n \n \n
\n \n)\n" }, { "path": "website/components/Layout.tsx", "content": "import Head from 'next/head'\nimport { useRouter } from 'next/router'\nimport { Footer } from 'components/Footer'\nimport { Header, ItemSlug } from 'components/Header'\nimport { generateTitle } from 'utils/title'\nimport { absoluteUrl } from 'utils/url'\n\nexport type LayoutProps = React.PropsWithChildren<{\n activeItem?: ItemSlug\n canonical?: string\n description?: string\n image?: string\n noIndex?: boolean\n title?: string | string[]\n type?: string\n}>\n\nconst defaultDescription =\n 'Marp (also known as the Markdown Presentation Ecosystem) provides an intuitive experience for creating beautiful slide decks. You only have to focus on writing your story in a Markdown document.'\n\nexport const Layout: React.FC = ({\n activeItem,\n canonical: _canonical,\n children,\n description = defaultDescription,\n image: _image,\n noIndex,\n title: _title,\n type = 'article',\n}) => {\n const router = useRouter()\n\n const canonical = absoluteUrl(_canonical || router.asPath).href\n const image = _image || '/assets/og-image.png'\n const title = typeof _title === 'string' ? _title : generateTitle(_title)\n\n return (\n <>\n \n {title}\n {description && (\n <>\n \n \n \n )}\n {canonical && (\n <>\n \n \n \n )}\n \n \n \n \n {noIndex && }\n \n
\n
\n {children}\n \n
\n