chore: add changelog 4.8.3

Please makes sure these boxes are checked before submitting your PR, thank you!

* [x] Make sure you are merging your commits to `master` branch.
* [x] Add some descriptions and refer relative issues for you PR.
* [x] DO NOT include files inside `lib` directory.

A temporary solution, I will refactor this part of the code in the next major version.

CHANGELOG.md

@@ -1,3 +1,26 @@
+<a name="4.8.3"></a>
+## [4.8.3](https://github.com/docsifyjs/docsify/compare/v4.8.2...v4.8.3) (2018-11-01)
+
+
+
+<a name="4.8.2"></a>
+## [4.8.2](https://github.com/docsifyjs/docsify/compare/v4.8.1...v4.8.2) (2018-11-01)
+
+
+### Bug Fixes
+
+* cover button style, fixed [#670](https://github.com/docsifyjs/docsify/issues/670), fixed [#665](https://github.com/docsifyjs/docsify/issues/665) ([#675](https://github.com/docsifyjs/docsify/issues/675)) ([fcd1087](https://github.com/docsifyjs/docsify/commit/fcd1087))
+* update match regex ([#669](https://github.com/docsifyjs/docsify/issues/669)) ([2edf47e](https://github.com/docsifyjs/docsify/commit/2edf47e))
+* use copy of cached value ([#668](https://github.com/docsifyjs/docsify/issues/668)) ([5fcf210](https://github.com/docsifyjs/docsify/commit/5fcf210))
+* **compiler:** import prism-markup-templating, fixed [#672](https://github.com/docsifyjs/docsify/issues/672) ([#676](https://github.com/docsifyjs/docsify/issues/676)) ([fdd8826](https://github.com/docsifyjs/docsify/commit/fdd8826))
+
+
+### Features
+
+* add heading config id ([#671](https://github.com/docsifyjs/docsify/issues/671)) ([ab19b13](https://github.com/docsifyjs/docsify/commit/ab19b13))
+
+
+
 <a name="4.8.1"></a>
 ## [4.8.1](https://github.com/docsifyjs/docsify/compare/v4.8.0...v4.8.1) (2018-10-31)
 

README.md

@@ -36,7 +36,7 @@
 ## Features
 
 - No statically built html files
-- Simple and lightweight (~19kB gzipped)
+- Simple and lightweight (~21kB gzipped)
 - Smart full-text search plugin
 - Multiple themes
 - Useful plugin API
@@ -46,7 +46,9 @@
 
 ## Quick start
 
-Look at [this tutorial](https://docsify.js.org/#/quickstart) or [online demo](https://jsfiddle.net/7ztb8qsr/1/).
+Look at [this tutorial](https://docsify.js.org/#/quickstart)
+
+[![Edit 307qqv236](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/307qqv236)
 
 ## Showcase
 
@@ -103,6 +105,6 @@ This project exists thanks to all the people who contribute. [[Contribute](CONTR
 
 ## License
 
-MIT
+[MIT](LICENSE)
 
 [![FOSSA Status](https://app.fossa.io/api/projects/git%2Bhttps%3A%2F%2Fgithub.com%2Fdocsifyjs%2Fdocsify.svg?type=large)](https://app.fossa.io/projects/git%2Bhttps%3A%2F%2Fgithub.com%2Fdocsifyjs%2Fdocsify?ref=badge_large)

docs/README.md

@@ -11,7 +11,7 @@ See the [Quick start](quickstart.md) guide for more details.
 ## Features
 
 - No statically built html files
-- Simple and lightweight (~19kB gzipped)
+- Simple and lightweight (~21kB gzipped)
 - Smart full-text search plugin
 - Multiple themes
 - Useful plugin API

docs/_coverpage.md

@@ -1,12 +1,12 @@
 ![logo](_media/icon.svg)
 
-# docsify <small>4.8.1</small>
+# docsify <small>4.8.3</small>
 
 > A magical documentation site generator.
 
-* Simple and lightweight (~19kB gzipped)
-* No statically built html files
-* Multiple themes
+- Simple and lightweight (~21kB gzipped)
+- No statically built html files
+- Multiple themes
 
 [GitHub](https://github.com/docsifyjs/docsify/)
 [Getting Started](#docsify)

docs/cover.md

@@ -26,9 +26,9 @@ Set `coverpage` to **true**, and create a `_coverpage.md`:
 
 > A magical documentation site generator.
 
-* Simple and lightweight (~19kB gzipped)
-* No statically built html files
-* Multiple themes
+- Simple and lightweight (~21kB gzipped)
+- No statically built html files
+- Multiple themes
 
 [GitHub](https://github.com/docsifyjs/docsify/)
 [Get Started](#docsify)

docs/helpers.md

@@ -94,3 +94,9 @@ You will get `<a href="/demo/">link</a>`html. Do not worry, you can still set ti
 ![logo](https://docsify.js.org/_media/icon.svg ':size=50x100')
 ![logo](https://docsify.js.org/_media/icon.svg ':size=100')
 ![logo](https://docsify.js.org/_media/icon.svg ':size=10%')
+
+## Customise ID for headings
+
+```md
+### 你好，世界！ :id=hello-world
+```

docs/plugins.md

@@ -95,7 +95,7 @@ Medium's image zoom. Based on [medium-zoom](https://github.com/francoischalifour
 Exclude the special image
 
 ```markdown
-![](image.png ':no-zoom')
+![](image.png ":no-zoom")
 ```
 
 ## Edit on github
@@ -184,6 +184,10 @@ window.$docsify = {
 
 A docsify.js plugin for displaying tabbed content from markdown.
 
-* [Documentation & Demos](https://jhildenbiddle.github.io/docsify-tabs)
+- [Documentation & Demos](https://jhildenbiddle.github.io/docsify-tabs)
 
 Provided by [@jhildenbiddle](https://github.com/jhildenbiddle/docsify-tabs).
+
+## More plugins
+
+See [awesome-docsify](awesome?id=plugins)

lib/docsify.js

@@ -3233,6 +3233,97 @@ var replaceSlug = cached(function (path) {
   return path.replace('#', '?id=')
 });
 
+Prism.languages['markup-templating'] = {};
+
+Object.defineProperties(Prism.languages['markup-templating'], {
+	buildPlaceholders: {
+		// Tokenize all inline templating expressions matching placeholderPattern
+		// If the replaceFilter function is provided, it will be called with every match.
+		// If it returns false, the match will not be replaced.
+		value: function (env, language, placeholderPattern, replaceFilter) {
+			if (env.language !== language) {
+				return;
+			}
+
+			env.tokenStack = [];
+
+			env.code = env.code.replace(placeholderPattern, function(match) {
+				if (typeof replaceFilter === 'function' && !replaceFilter(match)) {
+					return match;
+				}
+				var i = env.tokenStack.length;
+				// Check for existing strings
+				while (env.code.indexOf('___' + language.toUpperCase() + i + '___') !== -1)
+					{ ++i; }
+
+				// Create a sparse array
+				env.tokenStack[i] = match;
+
+				return '___' + language.toUpperCase() + i + '___';
+			});
+
+			// Switch the grammar to markup
+			env.grammar = Prism.languages.markup;
+		}
+	},
+	tokenizePlaceholders: {
+		// Replace placeholders with proper tokens after tokenizing
+		value: function (env, language) {
+			if (env.language !== language || !env.tokenStack) {
+				return;
+			}
+
+			// Switch the grammar back
+			env.grammar = Prism.languages[language];
+
+			var j = 0;
+			var keys = Object.keys(env.tokenStack);
+			var walkTokens = function (tokens) {
+				if (j >= keys.length) {
+					return;
+				}
+				for (var i = 0; i < tokens.length; i++) {
+					var token = tokens[i];
+					if (typeof token === 'string' || (token.content && typeof token.content === 'string')) {
+						var k = keys[j];
+						var t = env.tokenStack[k];
+						var s = typeof token === 'string' ? token : token.content;
+
+						var index = s.indexOf('___' + language.toUpperCase() + k + '___');
+						if (index > -1) {
+							++j;
+							var before = s.substring(0, index);
+							var middle = new Prism.Token(language, Prism.tokenize(t, env.grammar, language), 'language-' + language, t);
+							var after = s.substring(index + ('___' + language.toUpperCase() + k + '___').length);
+							var replacement;
+							if (before || after) {
+								replacement = [before, middle, after].filter(function (v) { return !!v; });
+								walkTokens(replacement);
+							} else {
+								replacement = middle;
+							}
+							if (typeof token === 'string') {
+								Array.prototype.splice.apply(tokens, [i, 1].concat(replacement));
+							} else {
+								token.content = replacement;
+							}
+
+							if (j >= keys.length) {
+								break;
+							}
+						}
+					} else if (token.content && typeof token.content !== 'string') {
+						walkTokens(token.content);
+					}
+				}
+			};
+
+			walkTokens(env.tokens);
+		}
+	}
+});
+
+// See https://github.com/PrismJS/prism/pull/1367
 var cachedLinks = {};
 
 function getAndRemoveConfig(str) {
@@ -3424,26 +3515,29 @@ Compiler.prototype._initRenderer = function _initRenderer () {
    * @link https://github.com/markedjs/marked#overriding-renderer-methods
    */
   origin.heading = renderer.heading = function (text, level) {
-    var nextToc = {level: level, title: text};
+    var ref = getAndRemoveConfig(text);
+      var str = ref.str;
+      var config = ref.config;
+    var nextToc = {level: level, title: str};
 
-    if (/{docsify-ignore}/g.test(text)) {
-      text = text.replace('{docsify-ignore}', '');
-      nextToc.title = text;
+    if (/{docsify-ignore}/g.test(str)) {
+      str = str.replace('{docsify-ignore}', '');
+      nextToc.title = str;
       nextToc.ignoreSubHeading = true;
     }
 
-    if (/{docsify-ignore-all}/g.test(text)) {
-      text = text.replace('{docsify-ignore-all}', '');
-      nextToc.title = text;
+    if (/{docsify-ignore-all}/g.test(str)) {
+      str = str.replace('{docsify-ignore-all}', '');
+      nextToc.title = str;
       nextToc.ignoreAllSubs = true;
     }
 
-    var slug = slugify(text);
+    var slug = slugify(config.id || str);
     var url = router.toURL(router.getCurrentPath(), {id: slug});
     nextToc.slug = url;
     _self.toc.push(nextToc);
 
-    return ("<h" + level + " id=\"" + slug + "\"><a href=\"" + url + "\" data-id=\"" + slug + "\" class=\"anchor\"><span>" + text + "</span></a></h" + level + ">")
+    return ("<h" + level + " id=\"" + slug + "\"><a href=\"" + url + "\" data-id=\"" + slug + "\" class=\"anchor\"><span>" + str + "</span></a></h" + level + ">")
   };
   // Highlight code
   origin.code = renderer.code = function (code, lang) {
@@ -3996,9 +4090,11 @@ function prerenderEmbed(ref, done) {
   var raw = ref.raw; if ( raw === void 0 ) raw = '';
   var fetch = ref.fetch;
 
-  var hit;
-  if ((hit = cached$1[raw])) {
-    return done(hit)
+  var hit = cached$1[raw];
+  if (hit) {
+    var copy = hit.slice();
+    copy.links = hit.links;
+    return done(copy)
   }
 
   var compile = compiler._marked;
@@ -4221,9 +4317,10 @@ function renderMixin(proto) {
     toggleClass(el, 'add', 'show');
 
     var html = this.coverIsHTML ? text : this.compiler.cover(text);
+
     var m = html
       .trim()
-      .match('<p><img.*?data-origin="(.*?)"[^a]+alt="(.*?)">([^<]*?)</p>$');
+      .match('<img.*?data-origin="(.*?)"[^a]+alt="(.*?)">([^<]*?)$');
 
     if (m) {
       if (m[2] === 'color') {
@@ -4242,6 +4339,17 @@ function renderMixin(proto) {
       html = html.replace(m[0], '');
     }
 
+    // XXX: A Workaround
+    html = html
+      .split('\n')
+      .map(function (part) {
+        if (/^<a/.test(part)) {
+          return part.replace('<a', '<a data-button')
+        }
+        return part
+      })
+      .join('\n');
+
     this._renderTo('.cover-main', html);
     sticky();
   };
@@ -4952,7 +5060,7 @@ initGlobalAPI();
 /**
  * Version
  */
-Docsify.version = '4.8.1';
+Docsify.version = '4.8.3';
 
 /**
  * Run Docsify

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "docsify",
-  "version": "4.8.1",
+  "version": "4.8.3",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "docsify",
-  "version": "4.8.1",
+  "version": "4.8.3",
   "description": "A magical documentation generator.",
   "author": {
     "name": "qingwei-li",

packages/docsify-server-renderer/package-lock.json

@@ -37,5 +37,5 @@
       "integrity": "sha1-6DWIAbhrg7F1YNTjw4LXrvIQCUQ="
     }
   },
-  "version": "4.8.1"
+  "version": "4.8.3"
 }

packages/docsify-server-renderer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "docsify-server-renderer",
-  "version": "4.8.1",
+  "version": "4.8.3",
   "description": "docsify server renderer",
   "author": {
     "name": "qingwei-li",

src/core/render/compiler.js

@@ -7,6 +7,9 @@ import {emojify} from './emojify'
 import {isAbsolutePath, getPath, getParentPath} from '../router/util'
 import {isFn, merge, cached, isPrimitive} from '../util/core'
 
+// See https://github.com/PrismJS/prism/pull/1367
+import 'prismjs/components/prism-markup-templating'
+
 const cachedLinks = {}
 
 export function getAndRemoveConfig(str = '') {
@@ -190,26 +193,27 @@ export class Compiler {
      * @link https://github.com/markedjs/marked#overriding-renderer-methods
      */
     origin.heading = renderer.heading = function (text, level) {
-      const nextToc = {level, title: text}
+      let {str, config} = getAndRemoveConfig(text)
+      const nextToc = {level, title: str}
 
-      if (/{docsify-ignore}/g.test(text)) {
-        text = text.replace('{docsify-ignore}', '')
-        nextToc.title = text
+      if (/{docsify-ignore}/g.test(str)) {
+        str = str.replace('{docsify-ignore}', '')
+        nextToc.title = str
         nextToc.ignoreSubHeading = true
       }
 
-      if (/{docsify-ignore-all}/g.test(text)) {
-        text = text.replace('{docsify-ignore-all}', '')
-        nextToc.title = text
+      if (/{docsify-ignore-all}/g.test(str)) {
+        str = str.replace('{docsify-ignore-all}', '')
+        nextToc.title = str
         nextToc.ignoreAllSubs = true
       }
 
-      const slug = slugify(text)
+      const slug = slugify(config.id || str)
       const url = router.toURL(router.getCurrentPath(), {id: slug})
       nextToc.slug = url
       _self.toc.push(nextToc)
 
-      return `<h${level} id="${slug}"><a href="${url}" data-id="${slug}" class="anchor"><span>${text}</span></a></h${level}>`
+      return `<h${level} id="${slug}"><a href="${url}" data-id="${slug}" class="anchor"><span>${str}</span></a></h${level}>`
     }
     // Highlight code
     origin.code = renderer.code = function (code, lang = '') {

src/core/render/embed.js

@@ -57,9 +57,11 @@ function walkFetchEmbed({embedTokens, compile, fetch}, cb) {
 }
 
 export function prerenderEmbed({compiler, raw = '', fetch}, done) {
-  let hit
-  if ((hit = cached[raw])) {
-    return done(hit)
+  let hit = cached[raw]
+  if (hit) {
+    const copy = hit.slice()
+    copy.links = hit.links
+    return done(copy)
   }
 
   const compile = compiler._marked

src/core/render/index.js

@@ -176,9 +176,10 @@ export function renderMixin(proto) {
     dom.toggleClass(el, 'add', 'show')
 
     let html = this.coverIsHTML ? text : this.compiler.cover(text)
+
     const m = html
       .trim()
-      .match('<p><img.*?data-origin="(.*?)"[^a]+alt="(.*?)">([^<]*?)</p>$')
+      .match('<img.*?data-origin="(.*?)"[^a]+alt="(.*?)">([^<]*?)$')
 
     if (m) {
       if (m[2] === 'color') {
@@ -197,6 +198,17 @@ export function renderMixin(proto) {
       html = html.replace(m[0], '')
     }
 
+    // XXX: A Workaround
+    html = html
+      .split('\n')
+      .map(part => {
+        if (/^<a/.test(part)) {
+          return part.replace('<a', '<a data-button')
+        }
+        return part
+      })
+      .join('\n')
+
     this._renderTo('.cover-main', html)
     sticky()
   }

src/themes/basic/_coverpage.styl

@@ -61,7 +61,7 @@ section.cover
     max-width 500px
     padding 0
 
-  .cover-main > p:last-child a
+  .cover-main > a[data-button]
     border-color var(--theme-color, $color-primary)
     border-radius 2rem
     border-style solid