securemark 0.253.0 → 0.254.0

package/.eslintrc.json

@@ -15,8 +15,14 @@
       "error",
       {
         "ignoreErrors": false,
+        "maxPatternSize": 3000,
+        "maxRepeatCount": 256,
+        "maxSimpleRepeatCount": 256,
         "attackTimeout": null,
-        "timeout": 30000
+        "incubationTimeout": null,
+        "recallTimeout": null,
+        "seedingTimeout": null,
+        "timeout": 1e6
       }
     ]
   },

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # Changelog
 
+## 0.254.0
+
+- Remove `sup`, `sub`, and `small` HTML tags.
+
+## 0.253.2
+
+- Refactoring.
+
+## 0.253.1
+
+- Refactoring.
+
 ## 0.253.0
 
 - Change annotation processing.

package/README.md

@@ -43,7 +43,7 @@ https://falsandtru.github.io/securemark/
 - Preformattedtext (```)
 - HorizontalRule (---)
 - Inline markups (*, `, []{}, {}, ![]{}, !{}, \[](), ++, ~~, (()), ...)
-- Inline HTML tags (\<small>, \<bdi>, ...)
+- Inline HTML tags (\<bdi>, \<bdo>)
 - Autolink (https://host, user@host, @user)
 - Shortmedia (!https://host/image.png, !https://youtu.be/...)
 - Syntex highlight (```lang filename)

package/design.md

@@ -307,3 +307,9 @@ MarkdownはGFMのように最初から高機能で完成度の高い拡張不要
 
 Data URIは保存および転送容量削減ならびにユーザーおよび管理者双方の集約的管理のためサポートしない。
 特に規制および公開レベルの媒体別設定の実現のためテキストとメディアの分離が必須となる。
+
+### HTML
+
+- \<small>: 法的表記を縮小表示すべきでないため削除。
+- \<sub>: \<small>の代わりに使用されないよう削除。他の構文との相性も悪い。
+- \<sup>: 同上。

package/dist/index.js

@@ -1,4 +1,4 @@
-/*! securemark v0.253.0 https://github.com/falsandtru/securemark | (c) 2017, falsandtru | UNLICENSED License */
+/*! securemark v0.254.0 https://github.com/falsandtru/securemark | (c) 2017, falsandtru | UNLICENSED License */
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
 		module.exports = factory(require("DOMPurify"), require("Prism"));
@@ -758,7 +758,26 @@ function run() {
 
 /***/ }),
 
-/***/ 413:
+/***/ 5529:
+/***/ ((__unused_webpack_module, exports) => {
+
+"use strict";
+
+
+Object.defineProperty(exports, "__esModule", ({
+  value: true
+}));
+exports.equal = void 0;
+
+function equal(a, b) {
+  return a === a ? a === b : b !== b;
+}
+
+exports.equal = equal;
+
+/***/ }),
+
+/***/ 5084:
 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
 
 "use strict";
@@ -863,25 +882,6 @@ exports.MultiMap = MultiMap;
 
 /***/ }),
 
-/***/ 5529:
-/***/ ((__unused_webpack_module, exports) => {
-
-"use strict";
-
-
-Object.defineProperty(exports, "__esModule", ({
-  value: true
-}));
-exports.equal = void 0;
-
-function equal(a, b) {
-  return a === a ? a === b : b !== b;
-}
-
-exports.equal = equal;
-
-/***/ }),
-
 /***/ 7822:
 /***/ ((__unused_webpack_module, exports, __webpack_require__) => {
 
@@ -1417,7 +1417,7 @@ Object.defineProperty(exports, "__esModule", ({
   value: true
 }));
 
-__exportStar(__webpack_require__(413), exports);
+__exportStar(__webpack_require__(5084), exports);
 
 /***/ }),
 
@@ -3314,7 +3314,7 @@ function bind(target, settings) {
       };
     }
 
-    for (const el of (0, footnote_1.footnote)(next(0)?.parentNode ?? target, settings.footnotes, context)) {
+    for (const el of (0, footnote_1.footnote)(next(0)?.parentNode ?? target, settings.footnotes, context, bottom)) {
       el ? yield {
         type: 'footnote',
         value: el
@@ -4289,10 +4289,10 @@ exports.message = (0, combinator_1.block)((0, combinator_1.validate)('~~~', (0,
       }, `${opener}${body}${closer}`)];
   }
 
-  return [(0, dom_1.html)('div', {
+  return [(0, dom_1.html)('section', {
     class: `message`,
     'data-type': type
-  }, (0, array_1.unshift)([(0, dom_1.html)('h6', title(type))], [...(0, segment_1.segment)(body)].reduce((acc, seg) => (0, array_1.push)(acc, (0, parser_1.eval)(content(seg, context), [])), [])))];
+  }, (0, array_1.unshift)([(0, dom_1.html)('h1', title(type))], [...(0, segment_1.segment)(body)].reduce((acc, seg) => (0, array_1.push)(acc, (0, parser_1.eval)(content(seg, context), [])), [])))];
 })));
 
 function title(type) {
@@ -4514,7 +4514,8 @@ function format(rows) {
     let lHeadCellIdx;
     let rHeadCellIdx;
 
-    for (let j = 0, jn = 0n; j < cells.length; jn = (0, global_1.BigInt)(++j)) {
+    for (let j = 0; j < cells.length; ++j) {
+      const jn = (0, global_1.BigInt)(j);
       const isVirtual = !!ranges[i]?.[j];
       const cell = isVirtual ? (0, array_1.splice)(cells, j, 0, global_1.undefined) && ranges[i][j] : cells[j];
       const isHeadCell = cell.tagName === 'TH';
@@ -4545,8 +4546,8 @@ function format(rows) {
 
       if (colSpan > 1) {
         (0, array_1.splice)(cells, j + 1, 0, ...(0, global_1.Array)(colSpan - 1));
-        heads |= (0, global_1.BigInt)(+`0b${`${heads & 1n << jn && 1}`.repeat(colSpan)}`) << jn;
-        highlights |= (0, global_1.BigInt)(+`0b${`${highlights & 1n << jn && 1}`.repeat(colSpan)}`) << jn;
+        heads |= heads & 1n << jn && ~(~0n << (0, global_1.BigInt)(colSpan)) << jn;
+        highlights |= highlights & 1n << jn && ~(~0n << (0, global_1.BigInt)(colSpan)) << jn;
         j += colSpan - 1;
       }
 
@@ -6209,20 +6210,24 @@ const cache_1 = __webpack_require__(9210);
 
 const array_1 = __webpack_require__(8112);
 
-const tags = global_1.Object.freeze(['wbr', 'sup', 'sub', 'small', 'bdo', 'bdi']);
-const attrspec = {
+const tags = global_1.Object.freeze(['bdo', 'bdi']);
+const attrspecs = {
   bdo: {
     dir: global_1.Object.freeze(['ltr', 'rtl'])
   }
 };
-global_1.Object.setPrototypeOf(attrspec, null);
-global_1.Object.values(attrspec).forEach(o => global_1.Object.setPrototypeOf(o, null));
-exports.html = (0, combinator_1.lazy)(() => (0, combinator_1.creator)((0, combinator_1.validate)('<', (0, combinator_1.validate)(/^<[a-z]+(?=[^\S\n]|>)/, (0, combinator_1.union)([(0, combinator_1.match)(/^<(wbr)(?=[^\S\n]|>)/, (0, memoize_1.memoize)(([, tag]) => (0, combinator_1.surround)(`<${tag}`, (0, combinator_1.some)((0, combinator_1.union)([exports.attribute])), /^\s*>/, true, ([, bs = []], rest) => [[(0, dom_1.html)(tag, attributes('html', [], attrspec[tag], bs))], rest]), ([, tag]) => tags.indexOf(tag), [])), (0, combinator_1.match)(/^<(sup|sub|small|bdo|bdi)(?=[^\S\n]|>)/, (0, memoize_1.memoize)(([, tag]) => (0, combinator_1.surround)((0, combinator_1.surround)((0, source_1.str)(`<${tag}`), (0, combinator_1.some)(exports.attribute), (0, source_1.str)(/^\s*>/), true), (0, util_1.startLoose)((0, combinator_1.some)((0, combinator_1.union)([(0, combinator_1.open)(/^\n?/, (0, combinator_1.some)(inline_1.inline, (0, util_1.blankWith)('\n', `</${tag}>`)), true)])), `</${tag}>`), (0, source_1.str)(`</${tag}>`), false, ([as, bs, cs], rest) => [[elem(tag, as, bs, cs)], rest]), ([, tag]) => tags.indexOf(tag), [])), (0, combinator_1.match)(/^<([a-z]+)(?=[^\S\n]|>)/, (0, memoize_1.memoize)(([, tag]) => (0, combinator_1.surround)((0, combinator_1.surround)((0, source_1.str)(`<${tag}`), (0, combinator_1.some)(exports.attribute), (0, source_1.str)(/^\s*>/), true), (0, util_1.startLoose)((0, combinator_1.some)((0, combinator_1.union)([(0, combinator_1.open)(/^\n?/, (0, combinator_1.some)(inline_1.inline, (0, util_1.blankWith)('\n', `</${tag}>`)), true)])), `</${tag}>`), (0, source_1.str)(`</${tag}>`), false, ([as, bs, cs], rest) => [[elem(tag, as, bs, cs)], rest]), ([, tag]) => tag, new cache_1.Cache(10000)))])))));
-exports.attribute = (0, combinator_1.union)([(0, source_1.str)(/^[^\S\n]+[a-z]+(?:-[a-z]+)*(?:="(?:\\[^\n]|[^\\\n"])*")?(?=[^\S\n]|>)/)]);
+global_1.Object.setPrototypeOf(attrspecs, null);
+global_1.Object.values(attrspecs).forEach(o => global_1.Object.setPrototypeOf(o, null));
+exports.html = (0, combinator_1.lazy)(() => (0, combinator_1.creator)((0, combinator_1.validate)('<', (0, combinator_1.validate)(/^<[a-z]+(?=[^\S\n]|>)/, (0, combinator_1.union)([(0, combinator_1.focus)('<wbr>', () => [[(0, dom_1.html)('wbr')], '']), (0, combinator_1.focus)( // https://html.spec.whatwg.org/multipage/syntax.html#void-elements
+/^<(?:area|base|br|col|embed|hr|img|input|link|meta|source|track|wbr)(?=[^\S\n]|>)/, source => [[source], '']), (0, combinator_1.match)(new RegExp(String.raw`^<(${TAGS.join('|')})(?=[^\S\n]|>)`), (0, memoize_1.memoize)(([, tag]) => (0, combinator_1.surround)((0, combinator_1.surround)((0, source_1.str)(`<${tag}`), (0, combinator_1.some)(exports.attribute), (0, source_1.str)(/^[^\S\n]*>/), true), (0, util_1.startLoose)((0, combinator_1.some)((0, combinator_1.union)([(0, combinator_1.open)(/^\n?/, (0, combinator_1.some)(inline_1.inline, (0, util_1.blankWith)('\n', `</${tag}>`)), true)])), `</${tag}>`), (0, source_1.str)(`</${tag}>`), false, ([as, bs, cs], rest) => [[elem(tag, as, bs, cs)], rest]), ([, tag]) => TAGS.indexOf(tag), [])), (0, combinator_1.match)(/^<([a-z]+)(?=[^\S\n]|>)/, (0, memoize_1.memoize)(([, tag]) => (0, combinator_1.surround)((0, combinator_1.surround)((0, source_1.str)(`<${tag}`), (0, combinator_1.some)(exports.attribute), (0, source_1.str)(/^[^\S\n]*>/), true), (0, util_1.startLoose)((0, combinator_1.some)((0, combinator_1.union)([(0, combinator_1.open)(/^\n?/, (0, combinator_1.some)(inline_1.inline, (0, util_1.blankWith)('\n', `</${tag}>`)), true)])), `</${tag}>`), (0, source_1.str)(`</${tag}>`), false, ([as, bs, cs], rest) => [[elem(tag, as, bs, cs)], rest]), ([, tag]) => tag, new cache_1.Cache(10000)))])))));
+exports.attribute = (0, combinator_1.union)([(0, source_1.str)(/^[^\S\n]+[a-z]+(?:-[a-z]+)*(?:="(?:\\[^\n]|[^\\\n"])*")?(?=[^\S\n]|>)/)]); // https://developer.mozilla.org/en-US/docs/Web/HTML/Element
+// [...document.querySelectorAll('tbody > tr > td:first-child')].map(el => el.textContent.slice(1, -1))
+
+const TAGS = global_1.Object.freeze(["html", "base", "head", "link", "meta", "style", "title", "body", "address", "article", "aside", "footer", "header", "h1", "h2", "h3", "h4", "h5", "h6", "main", "nav", "section", "blockquote", "dd", "div", "dl", "dt", "figcaption", "figure", "hr", "li", "menu", "ol", "p", "pre", "ul", "a", "abbr", "b", "bdi", "bdo", "br", "cite", "code", "data", "dfn", "em", "i", "kbd", "mark", "q", "rp", "rt", "ruby", "s", "samp", "small", "span", "strong", "sub", "sup", "time", "u", "var", "wbr", "area", "audio", "img", "map", "track", "video", "embed", "iframe", "object", "picture", "portal", "source", "svg", "math", "canvas", "noscript", "script", "del", "ins", "caption", "col", "colgroup", "table", "tbody", "td", "tfoot", "th", "thead", "tr", "button", "datalist", "fieldset", "form", "input", "label", "legend", "meter", "optgroup", "option", "output", "progress", "select", "textarea", "details", "dialog", "summary", "slot", "template", "acronym", "applet", "basefont", "bgsound", "big", "blink", "center", "content", "dir", "font", "frame", "frameset", "hgroup", "image", "keygen", "marquee", "menuitem", "nobr", "noembed", "noframes", "param", "plaintext", "rb", "rtc", "shadow", "spacer", "strike", "tt", "xmp"]);
 
 function elem(tag, as, bs, cs) {
   if (!tags.includes(tag)) return invalid('tag', `Invalid HTML tag <${tag}>`, as, bs, cs);
-  const attrs = attributes('html', [], attrspec[tag], as.slice(1, -1));
+  const attrs = attributes('html', [], attrspecs[tag], as.slice(1, -1));
   return 'data-invalid-syntax' in attrs ? invalid('attribute', 'Invalid HTML attribute', as, bs, cs) : (0, dom_1.html)(tag, attrs, (0, dom_1.defrag)(bs));
 }
 
@@ -6246,7 +6251,7 @@ function attributes(syntax, classes, spec, params) {
     const name = param.split('=', 1)[0];
     const value = param !== name ? param.slice(name.length + 2, -1).replace(/\\(.?)/g, '$1') : global_1.undefined;
     invalid ||= !spec || name in attrs;
-    if (spec && !spec[name] && name in spec) continue;
+    if (spec && name in spec && !spec[name]) continue;
     spec?.[name]?.includes(value) || value !== global_1.undefined && spec?.[name]?.length === 0 ? attrs[name] = value ?? '' : invalid ||= !!spec;
     (0, array_1.splice)(params, i--, 1);
   }
@@ -6997,7 +7002,7 @@ const multimap_1 = __webpack_require__(940);
 const array_1 = __webpack_require__(8112);
 
 function* figure(target, footnotes, opts = {}) {
-  const refs = new multimap_1.MultiMap((0, array_1.push)((0, array_1.push)((0, array_1.push)([], target.querySelectorAll('a.label:not(.disabled)[data-label]')), footnotes?.annotations?.querySelectorAll('a.label:not(.disabled)') ?? []), footnotes?.references.querySelectorAll('a.label:not(.disabled)') ?? []).map(el => [el.getAttribute('data-label'), el]));
+  const refs = new multimap_1.MultiMap((0, array_1.push)((0, array_1.push)([], target.querySelectorAll('a.label:not(.disabled)[data-label]')), footnotes?.references.querySelectorAll('a.label:not(.disabled)') ?? []).map(el => [el.getAttribute('data-label'), el]));
   const labels = new global_1.Set();
   const numbers = new global_1.Map();
   let base = '0';
@@ -7191,9 +7196,9 @@ const multimap_1 = __webpack_require__(940);
 
 const array_1 = __webpack_require__(8112);
 
-function* footnote(target, footnotes, opts = {}) {
-  yield* (0, exports.reference)(target, footnotes?.references, opts);
-  yield* (0, exports.annotation)(target, footnotes?.annotations, opts);
+function* footnote(target, footnotes, opts = {}, bottom = null) {
+  yield* (0, exports.reference)(target, footnotes?.references, opts, bottom);
+  yield* (0, exports.annotation)(target, footnotes?.annotations, opts, bottom);
   return;
 }
 
@@ -7204,8 +7209,7 @@ exports.reference = build('reference', (n, abbr) => `[${abbr || n}]`);
 function build(syntax, marker, splitter) {
   // Referenceを含むAnnotationの重複排除は両構文が互いに処理済みであることを必要とするため
   // 構文ごとに各1回の処理では不可能
-  return function* (target, footnote, opts = {}) {
-    //assert(syntax !== 'annotation' || !footnote);
+  return function* (target, footnote, opts = {}, bottom = null) {
     const defs = new global_1.Map();
     const buffer = new multimap_1.MultiMap();
     const titles = new global_1.Map(); // Bug: Firefox
@@ -7312,7 +7316,7 @@ function build(syntax, marker, splitter) {
     if (defs.size > 0 || footnote) {
       yield* proc(defs, footnote ?? target.insertBefore((0, dom_1.html)('ol', {
         class: `${syntax}s`
-      }), splitters[0] ?? target.querySelector(':scope > :is(#annotations, #references)')));
+      }), splitters[0] ?? bottom));
     }
 
     return;
@@ -8740,7 +8744,7 @@ function fix(h) {
 /***/ 3252:
 /***/ (function(module) {
 
-/*! typed-dom v0.0.298 https://github.com/falsandtru/typed-dom | (c) 2016, falsandtru | (Apache-2.0 AND MPL-2.0) License */
+/*! typed-dom v0.0.299 https://github.com/falsandtru/typed-dom | (c) 2016, falsandtru | (Apache-2.0 AND MPL-2.0) License */
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(true)
 		module.exports = factory();
@@ -9174,7 +9178,7 @@ exports.defrag = defrag;
 /***/ 6120:
 /***/ (function(module) {
 
-/*! typed-dom v0.0.298 https://github.com/falsandtru/typed-dom | (c) 2016, falsandtru | (Apache-2.0 AND MPL-2.0) License */
+/*! typed-dom v0.0.299 https://github.com/falsandtru/typed-dom | (c) 2016, falsandtru | (Apache-2.0 AND MPL-2.0) License */
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(true)
 		module.exports = factory();

package/index.d.ts

@@ -5,7 +5,7 @@
 * @author falsandtru https://github.com/falsandtru/securemark
 */
 
-import { Collection } from 'spica/collection';
+import { Dict } from 'spica/dict';
 
 export function parse(source: string, options?: ParserOptions): DocumentFragment;
 export function bind(target: DocumentFragment | HTMLElement | ShadowRoot, settings: ParserSettings): {
@@ -33,7 +33,6 @@ export interface ParserSettings {
   // For editing.
   readonly caches?: Partial<Caches>;
   readonly footnotes: {
-    readonly annotations?: HTMLOListElement;
     readonly references: HTMLOListElement;
   };
   readonly chunk?: boolean;
@@ -48,23 +47,23 @@ export type Progress =
   | { type: 'cancel' };
 
 export interface RenderingOptions {
-  readonly code?: (target: HTMLElement, cache?: Collection<string, HTMLElement>) => void;
-  readonly math?: (target: HTMLElement, cache?: Collection<string, HTMLElement>) => void;
+  readonly code?: (target: HTMLElement, cache?: Dict<string, HTMLElement>) => void;
+  readonly math?: (target: HTMLElement, cache?: Dict<string, HTMLElement>) => void;
   readonly media?: {
     readonly twitter?: (source: HTMLImageElement, url: URL) => HTMLElement | undefined;
     readonly youtube?: (source: HTMLImageElement, url: URL) => HTMLElement | undefined;
     readonly pdf?: (source: HTMLImageElement, url: URL) => HTMLElement | undefined;
     readonly video?: (source: HTMLImageElement, url: URL) => HTMLVideoElement | undefined;
     readonly audio?: (source: HTMLImageElement, url: URL) => HTMLAudioElement | undefined;
-    readonly image?: (source: HTMLImageElement, url: URL, cache?: Collection<string, HTMLElement>) => HTMLImageElement;
+    readonly image?: (source: HTMLImageElement, url: URL, cache?: Dict<string, HTMLElement>) => HTMLImageElement;
   };
   readonly caches?: Partial<Caches>;
 }
 
 export interface Caches {
-  readonly code: Collection<string, HTMLElement>;
-  readonly math: Collection<string, HTMLElement>;
-  readonly media: Collection<string, HTMLElement>;
+  readonly code: Dict<string, HTMLElement>;
+  readonly math: Dict<string, HTMLElement>;
+  readonly media: Dict<string, HTMLElement>;
 }
 
 export interface Info {

package/markdown.d.ts

@@ -1,5 +1,5 @@
 import { Parser, Ctx } from './src/combinator/data/parser';
-import { Collection } from 'spica/collection';
+import { Dict } from 'spica/dict';
 
 declare abstract class Markdown<T> {
   private parser?: T;
@@ -29,9 +29,9 @@ export namespace MarkdownParser {
       };
     };
     readonly caches?: {
-      readonly code?: Collection<string, HTMLElement>;
-      readonly math?: Collection<string, HTMLElement>;
-      readonly media?: Collection<string, HTMLElement>;
+      readonly code?: Dict<string, HTMLElement>;
+      readonly math?: Dict<string, HTMLElement>;
+      readonly media?: Dict<string, HTMLElement>;
     };
   }
   export interface SegmentParser extends
@@ -964,11 +964,12 @@ export namespace MarkdownParser {
       }
     }
     export interface HTMLParser extends
-      // Allow: sup, sub, small, bdo, bdi
-      // <small>abc</small>
+      // Allow: wbr, bdo, bdi
+      // <bdi>abc</bdi>
       Inline<'html'>,
       Parser<HTMLElement | string, Context, [
         HTMLParser.OpenTagParser,
+        SourceParser.StrParser,
         HTMLParser.TagParser,
         HTMLParser.TagParser,
       ]> {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "securemark",
-  "version": "0.253.0",
+  "version": "0.254.0",
   "description": "Secure markdown renderer working on browsers for user input data.",
   "private": false,
   "homepage": "https://github.com/falsandtru/securemark",
@@ -34,29 +34,29 @@
     "@types/mocha": "9.1.1",
     "@types/power-assert": "1.5.8",
     "@types/prismjs": "1.26.0",
-    "@typescript-eslint/parser": "^5.27.1",
+    "@typescript-eslint/parser": "^5.28.0",
     "babel-loader": "^8.2.5",
     "babel-plugin-unassert": "^3.2.0",
-    "concurrently": "^7.2.1",
+    "concurrently": "^7.2.2",
     "eslint": "^8.17.0",
-    "eslint-plugin-redos": "^4.4.0",
+    "eslint-plugin-redos": "^4.4.1",
     "eslint-webpack-plugin": "^3.1.1",
     "glob": "^8.0.3",
-    "karma": "^6.3.20",
+    "karma": "^6.4.0",
     "karma-chrome-launcher": "^3.1.1",
     "karma-coverage": "^2.2.0",
     "karma-firefox-launcher": "^2.1.2",
     "karma-mocha": "^2.0.1",
     "karma-power-assert": "^1.0.0",
     "mocha": "^10.0.0",
-    "npm-check-updates": "^13.1.2",
+    "npm-check-updates": "^14.0.1",
     "semver": "^7.3.7",
-    "spica": "0.0.567",
+    "spica": "0.0.570",
     "ts-loader": "^9.3.0",
-    "typed-dom": "^0.0.298",
+    "typed-dom": "^0.0.299",
     "typescript": "4.7.3",
     "webpack": "^5.73.0",
-    "webpack-cli": "^4.9.2",
+    "webpack-cli": "^4.10.0",
     "webpack-merge": "^5.8.0"
   },
   "scripts": {

package/src/parser/api/bind.test.ts

@@ -1,4 +1,4 @@
-import { ParserSettings, Progress } from '../../..';
+import { Progress } from '../../..';
 import { bind } from './bind';
 import { frag, html } from 'typed-dom/dom';
 
@@ -27,7 +27,7 @@ describe('Unit: parser/api/bind', () => {
       return acc;
     }
 
-    const cfgs: ParserSettings = { footnotes: { annotations: html('ol'), references: html('ol') } };
+    const cfgs = { footnotes: { annotations: html('ol'), references: html('ol') } };
 
     it('huge input', () => {
       const iter = bind(html('div'), { ...cfgs, id: '' }).parse(`${'\n'.repeat(10 * 1000 ** 2)}`);

package/src/parser/api/bind.ts

@@ -122,7 +122,7 @@ export function bind(target: DocumentFragment | HTMLElement | ShadowRoot, settin
         : yield { type: 'break' };
       if (rev !== revision) return yield { type: 'cancel' };
     }
-    for (const el of footnote(next(0)?.parentNode ?? target, settings.footnotes, context)) {
+    for (const el of footnote(next(0)?.parentNode ?? target, settings.footnotes, context, bottom)) {
       assert(rev === revision);
       el
         ? yield { type: 'footnote', value: el }

package/src/parser/api/parse.ts

@@ -40,7 +40,6 @@ export function parse(source: string, opts: Options = {}, context?: MarkdownPars
   for (const _ of figure(node, opts.footnotes, context));
   for (const _ of footnote(node, opts.footnotes, context));
   assert(opts.id !== '' || !node.querySelector('[id], .index[href], .label[href], .annotation > a[href], .reference > a[href]'));
-  assert(opts.id !== '' || !opts.footnotes?.annotations?.querySelector('[id], .index[href], .label[href]'));
   assert(opts.id !== '' || !opts.footnotes?.references.querySelector('[id], .index[href], .label[href]'));
   return node;
 }

package/src/parser/block/extension/message.test.ts

@@ -15,13 +15,13 @@ describe('Unit: parser/block/extension/message', () => {
     });
 
     it('valid', () => {
-      assert.deepStrictEqual(inspect(parser('~~~message/note\n~~~')), [['<div class="message" data-type="note"><h6>Note</h6></div>'], '']);
-      assert.deepStrictEqual(inspect(parser('~~~message/note\n\n~~~')), [['<div class="message" data-type="note"><h6>Note</h6></div>'], '']);
-      assert.deepStrictEqual(inspect(parser('~~~message/note\na\n~~~')), [['<div class="message" data-type="note"><h6>Note</h6><p>a</p></div>'], '']);
-      assert.deepStrictEqual(inspect(parser('~~~message/note\na\n\n- \n~~~')), [['<div class="message" data-type="note"><h6>Note</h6><p>a</p><ul><li></li></ul></div>'], '']);
-      assert.deepStrictEqual(inspect(parser('~~~message/note\n# a\n~~~')), [['<div class="message" data-type="note"><h6>Note</h6><p># a</p></div>'], '']);
-      assert.deepStrictEqual(inspect(parser('~~~message/caution\n~~~')), [['<div class="message" data-type="caution"><h6>Caution!</h6></div>'], '']);
-      assert.deepStrictEqual(inspect(parser('~~~message/warning\n~~~')), [['<div class="message" data-type="warning"><h6>WARNING!!</h6></div>'], '']);
+      assert.deepStrictEqual(inspect(parser('~~~message/note\n~~~')), [['<section class="message" data-type="note"><h1>Note</h1></section>'], '']);
+      assert.deepStrictEqual(inspect(parser('~~~message/note\n\n~~~')), [['<section class="message" data-type="note"><h1>Note</h1></section>'], '']);
+      assert.deepStrictEqual(inspect(parser('~~~message/note\na\n~~~')), [['<section class="message" data-type="note"><h1>Note</h1><p>a</p></section>'], '']);
+      assert.deepStrictEqual(inspect(parser('~~~message/note\na\n\n- \n~~~')), [['<section class="message" data-type="note"><h1>Note</h1><p>a</p><ul><li></li></ul></section>'], '']);
+      assert.deepStrictEqual(inspect(parser('~~~message/note\n# a\n~~~')), [['<section class="message" data-type="note"><h1>Note</h1><p># a</p></section>'], '']);
+      assert.deepStrictEqual(inspect(parser('~~~message/caution\n~~~')), [['<section class="message" data-type="caution"><h1>Caution!</h1></section>'], '']);
+      assert.deepStrictEqual(inspect(parser('~~~message/warning\n~~~')), [['<section class="message" data-type="warning"><h1>WARNING!!</h1></section>'], '']);
     });
 
   });

package/src/parser/block/extension/message.ts

@@ -46,8 +46,8 @@ export const message: MessageParser = block(validate('~~~', fmap(
         }, `${opener}${body}${closer}`)];
     }
     return [
-      html('div', { class: `message`, 'data-type': type }, unshift(
-        [html('h6', title(type))],
+      html('section', { class: `message`, 'data-type': type }, unshift(
+        [html('h1', title(type))],
         [...segment(body)].reduce((acc, seg) => push(acc, eval(content(seg, context), [])), []))),
     ];
   })));

package/src/parser/block/extension/table.ts

@@ -220,7 +220,8 @@ function format(rows: Tree<RowParser>[]): HTMLTableSectionElement[] {
     let hasDataCell = false;
     let lHeadCellIdx: bigint;
     let rHeadCellIdx: bigint;
-    for (let j = 0, jn = 0n; j < cells.length; jn = BigInt(++j)) {
+    for (let j = 0; j < cells.length; ++j) {
+      const jn = BigInt(j);
       const isVirtual = !!ranges[i]?.[j];
       const cell = isVirtual
         ? splice(cells, j, 0, undefined) && ranges[i][j]
@@ -248,8 +249,8 @@ function format(rows: Tree<RowParser>[]): HTMLTableSectionElement[] {
       assert(colSpan > 0);
       if (colSpan > 1) {
         splice(cells, j + 1, 0, ...Array(colSpan - 1));
-        heads |= BigInt(+`0b${`${heads & 1n << jn && 1}`.repeat(colSpan)}`) << jn;
-        highlights |= BigInt(+`0b${`${highlights & 1n << jn && 1}`.repeat(colSpan)}`) << jn;
+        heads |= heads & 1n << jn && ~(~0n << BigInt(colSpan)) << jn;
+        highlights |= highlights & 1n << jn && ~(~0n << BigInt(colSpan)) << jn;
         j += colSpan - 1;
       }
       if (target === thead) {
@@ -311,7 +312,7 @@ function format(rows: Tree<RowParser>[]): HTMLTableSectionElement[] {
             'v c',
             'v h',
             'v h c',
-          ][+!!(highlights & m) + +!!(lHighlight | rHighlight) * 2 + +!!(tHighlights & m) * 4]));
+          ][+!!(highlights & m) | +!!(lHighlight | rHighlight) << 1 | +!!(tHighlights & m) << 2]));
         }
         continue;
       case tfoot:

package/src/parser/inline/emphasis.test.ts

@@ -46,7 +46,7 @@ describe('Unit: parser/inline/emphasis', () => {
       assert.deepStrictEqual(inspect(parser('*a**b**c*')), [['<em>a<strong>b</strong>c</em>'], '']);
       assert.deepStrictEqual(inspect(parser('*a**b**c*d')), [['<em>a<strong>b</strong>c</em>'], 'd']);
       assert.deepStrictEqual(inspect(parser('*`a`*')), [['<em><code data-src="`a`">a</code></em>'], '']);
-      assert.deepStrictEqual(inspect(parser('*<small>*')), [['<em>&lt;small&gt;</em>'], '']);
+      assert.deepStrictEqual(inspect(parser('*<bdi>*')), [['<em>&lt;bdi&gt;</em>'], '']);
       assert.deepStrictEqual(inspect(parser('*(*a*)*')), [['<em><span class="paren">(<em>a</em>)</span></em>'], '']);
       assert.deepStrictEqual(inspect(parser('*(**a**)*')), [['<em><span class="paren">(<strong>a</strong>)</span></em>'], '']);
     });

package/src/parser/inline/html.test.ts

@@ -11,12 +11,11 @@ describe('Unit: parser/inline/html', () => {
       assert.deepStrictEqual(inspect(parser('<script>alert()<script>')), undefined);
       assert.deepStrictEqual(inspect(parser('<script>alert()</script>')), [['<span class="invalid">&lt;script&gt;alert<span class="paren">()</span>&lt;/script&gt;</span>'], '']);
       assert.deepStrictEqual(inspect(parser('<script src="\\""></script>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small onclick="alert()">')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small onclick="alert()"></small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small onclick="alert()">a</small>')), [['<span class="invalid">&lt;small onclick="alert()"&gt;a&lt;/small&gt;</span>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small><small onclick="alert()">a</small></small>')), [['<small><span class="invalid">&lt;small onclick="alert()"&gt;a&lt;/small&gt;</span></small>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi onclick="alert()">')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi onclick="alert()"></bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi onclick="alert()">a</bdi>')), [['<span class="invalid">&lt;bdi onclick="alert()"&gt;a&lt;/bdi&gt;</span>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi><bdi onclick="alert()">a</bdi></bdi>')), [['<bdi><span class="invalid">&lt;bdi onclick="alert()"&gt;a&lt;/bdi&gt;</span></bdi>'], '']);
       assert.deepStrictEqual(inspect(parser('<bdo dir="rtl\\"><">a</bdo>')), [['<span class="invalid">&lt;bdo dir="rtl\\"&gt;&lt;"&gt;a&lt;/bdo&gt;</span>'], '']);
-      assert.deepStrictEqual(inspect(parser('<wbr onclick="alert()">')), [['<wbr class="invalid">'], '']);
     });
 
     it('invalid', () => {
@@ -26,78 +25,80 @@ describe('Unit: parser/inline/html', () => {
       assert.deepStrictEqual(inspect(parser('<a,b>')), undefined);
       assert.deepStrictEqual(inspect(parser('<a, b>')), undefined);
       assert.deepStrictEqual(inspect(parser('<T>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small>z')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small></small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small> </small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small>\\ </small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small>&Tab;</small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small><wbr></small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small>\n</small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small>\na</small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small>\\\na</small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small>a')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small>a</BDO>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<SMALL>a</SMALL>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<SMALL>a</bdo>')), undefined);
-      assert.deepStrictEqual(inspect(parser('</small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small/>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi>z')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi></bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi> </bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi>\\ </bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi>&Tab;</bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi><wbr></bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi>\n</bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi>\na</bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi>\\\na</bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi>a')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi>a</BDO>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<BDI>a</BDI>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<BDI>a</bdo>')), undefined);
+      assert.deepStrictEqual(inspect(parser('</bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi/>')), undefined);
       assert.deepStrictEqual(inspect(parser('<b><b><b>a</b></b></b>')), [['<span class="invalid">&lt;b&gt;<span class="invalid">&lt;b&gt;<span class="invalid">&lt;b&gt;a&lt;/b&gt;</span>&lt;/b&gt;</span>&lt;/b&gt;</span>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small><small><small>a</small></small></small>')), [['<small><small><small>a</small></small></small>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi><bdi><bdi>a</bdi></bdi></bdi>')), [['<bdi><bdi><bdi>a</bdi></bdi></bdi>'], '']);
       assert.deepStrictEqual(inspect(parser('<x a="*b*"')), undefined);
       assert.deepStrictEqual(inspect(parser('<x a="*b*">')), undefined);
       assert.deepStrictEqual(inspect(parser('<x a="*b*">c')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small a="*b*"')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small a="*b*">')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small a="*b*">c')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small a b="*" *c*')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small a b="*" *c*>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small a b="*" *c*>d</small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small a b="*" *>*c*')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small a b="*" *>*c*</small>')), undefined);
-      assert.deepStrictEqual(inspect(parser(' <small>a</small>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi a="*b*"')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi a="*b*">')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi a="*b*">c')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi a b="*" *c*')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi a b="*" *c*>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi a b="*" *c*>d</bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi a b="*" *>*c*')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi a b="*" *>*c*</bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser(' <bdi>a</bdi>')), undefined);
     });
 
     it('basic', () => {
-      assert.deepStrictEqual(inspect(parser('<small> a</small>')), [['<small> a</small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small> a </small>')), [['<small> a </small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small>  a  </small>')), [['<small>  a  </small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small>\\ a</small>')), [['<small> a</small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small><wbr>a</small>')), [['<small><wbr>a</small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small>a</small>')), [['<small>a</small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small>a</small>a')), [['<small>a</small>'], 'a']);
-      assert.deepStrictEqual(inspect(parser('<small>a </small>')), [['<small>a </small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small>a \n </small>')), [['<small>a </small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small>a\n</small>')), [['<small>a</small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small>a\n </small>')), [['<small>a </small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small>a\n<wbr></small>')), [['<small>a<wbr></small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small>a\nb</small>')), [['<small>a<br>b</small>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi> a</bdi>')), [['<bdi> a</bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi> a </bdi>')), [['<bdi> a </bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi>  a  </bdi>')), [['<bdi>  a  </bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi>\\ a</bdi>')), [['<bdi> a</bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi><wbr>a</bdi>')), [['<bdi><wbr>a</bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi>a</bdi>')), [['<bdi>a</bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi>a</bdi>a')), [['<bdi>a</bdi>'], 'a']);
+      assert.deepStrictEqual(inspect(parser('<bdi>a </bdi>')), [['<bdi>a </bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi>a \n </bdi>')), [['<bdi>a </bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi>a\n</bdi>')), [['<bdi>a</bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi>a\n </bdi>')), [['<bdi>a </bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi>a\n<wbr></bdi>')), [['<bdi>a<wbr></bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi>a\nb</bdi>')), [['<bdi>a<br>b</bdi>'], '']);
       assert.deepStrictEqual(inspect(parser('<wbr>a')), [['<wbr>'], 'a']);
     });
 
     it('nest', () => {
-      assert.deepStrictEqual(inspect(parser('<small><small>a</small></small>')), [['<small><small>a</small></small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small>a<small>b</small>c</small>')), [['<small>a<small>b</small>c</small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small>`a`</small>')), [['<small><code data-src="`a`">a</code></small>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi><bdi>a</bdi></bdi>')), [['<bdi><bdi>a</bdi></bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi>a<bdi>b</bdi>c</bdi>')), [['<bdi>a<bdi>b</bdi>c</bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi>`a`</bdi>')), [['<bdi><code data-src="`a`">a</code></bdi>'], '']);
     });
 
     it('escape', () => {
       assert.deepStrictEqual(inspect(parser('<a>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small><a>a</a></small>')), [['<small><span class="invalid">&lt;a&gt;a&lt;/a&gt;</span></small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small>a<a>b</a>c</small>')), [['<small>a<span class="invalid">&lt;a&gt;b&lt;/a&gt;</span>c</small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<img>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small><img></small>')), [['<small>&lt;img&gt;</small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<img />')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small><img /></small>')), [['<small>&lt;img /&gt;</small>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi><a>a</a></bdi>')), [['<bdi><span class="invalid">&lt;a&gt;a&lt;/a&gt;</span></bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi>a<a>b</a>c</bdi>')), [['<bdi>a<span class="invalid">&lt;a&gt;b&lt;/a&gt;</span>c</bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<img>')), [['<img'], '>']);
+      assert.deepStrictEqual(inspect(parser('<bdi><img></bdi>')), [['<bdi>&lt;img&gt;</bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<img />')), [['<img'], ' />']);
+      assert.deepStrictEqual(inspect(parser('<bdi><img /></bdi>')), [['<bdi>&lt;img /&gt;</bdi>'], '']);
     });
 
     it('attribute', () => {
-      assert.deepStrictEqual(inspect(parser('<small >a</small>')), [['<small>a</small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small  >a</small>')), [['<small>a</small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small __proto__>a</small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small constructor>a</small>')), [['<span class="invalid">&lt;small constructor&gt;a&lt;/small&gt;</span>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small toString>a</small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small X>a</small>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<small x>a</small>')), [['<span class="invalid">&lt;small x&gt;a&lt;/small&gt;</span>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi\n>a</bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi >a</bdi>')), [['<bdi>a</bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi \n>a</bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi  >a</bdi>')), [['<bdi>a</bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi __proto__>a</bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi constructor>a</bdi>')), [['<span class="invalid">&lt;bdi constructor&gt;a&lt;/bdi&gt;</span>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi toString>a</bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi X>a</bdi>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<bdi x>a</bdi>')), [['<span class="invalid">&lt;bdi x&gt;a&lt;/bdi&gt;</span>'], '']);
       assert.deepStrictEqual(inspect(parser('<bdo>a</bdo>')), [['<span class="invalid">&lt;bdo&gt;a&lt;/bdo&gt;</span>'], '']);
       assert.deepStrictEqual(inspect(parser('<bdo >a</bdo>')), [['<span class="invalid">&lt;bdo &gt;a&lt;/bdo&gt;</span>'], '']);
       assert.deepStrictEqual(inspect(parser('<bdo __proto__>a</bdo>')), undefined);
@@ -116,9 +117,11 @@ describe('Unit: parser/inline/html', () => {
       assert.deepStrictEqual(inspect(parser('<bdo dir="rtl" >a</bdo>')), [['<bdo dir="rtl">a</bdo>'], '']);
       assert.deepStrictEqual(inspect(parser('<bdo dir="rtl"  >a</bdo>')), [['<bdo dir="rtl">a</bdo>'], '']);
       assert.deepStrictEqual(inspect(parser('<bdo  dir="rtl">a</bdo>')), [['<bdo dir="rtl">a</bdo>'], '']);
-      assert.deepStrictEqual(inspect(parser('<wbr constructor>')), [['<wbr class="invalid">'], '']);
-      assert.deepStrictEqual(inspect(parser('<wbr X>')), undefined);
-      assert.deepStrictEqual(inspect(parser('<wbr x>')), [['<wbr class="invalid">'], '']);
+      assert.deepStrictEqual(inspect(parser('<wbr\n>')), undefined);
+      assert.deepStrictEqual(inspect(parser('<wbr >')), [['<wbr'], ' >']);
+      assert.deepStrictEqual(inspect(parser('<wbr constructor>')), [['<wbr'], ' constructor>']);
+      assert.deepStrictEqual(inspect(parser('<wbr X>')), [['<wbr'], ' X>']);
+      assert.deepStrictEqual(inspect(parser('<wbr x>')), [['<wbr'], ' x>']);
     });
 
   });

package/src/parser/inline/html.ts

@@ -1,6 +1,6 @@
 import { undefined, Object } from 'spica/global';
 import { HTMLParser } from '../inline';
-import { union, some, validate, creator, surround, open, match, lazy } from '../../combinator';
+import { union, some, validate, focus, creator, surround, open, match, lazy } from '../../combinator';
 import { inline } from '../inline';
 import { str } from '../source';
 import { startLoose, blankWith } from '../util';
@@ -9,44 +9,42 @@ import { memoize } from 'spica/memoize';
 import { Cache } from 'spica/cache';
 import { unshift, push, splice } from 'spica/array';
 
-const tags = Object.freeze(['wbr', 'sup', 'sub', 'small', 'bdo', 'bdi']);
-const attrspec = {
+const tags = Object.freeze(['bdo', 'bdi']);
+const attrspecs = {
   bdo: {
-    dir: Object.freeze(['ltr', 'rtl'] as const),
+    dir: Object.freeze(['ltr', 'rtl']),
   },
 } as const;
-Object.setPrototypeOf(attrspec, null);
-Object.values(attrspec).forEach(o => Object.setPrototypeOf(o, null));
+Object.setPrototypeOf(attrspecs, null);
+Object.values(attrspecs).forEach(o => Object.setPrototypeOf(o, null));
 
 export const html: HTMLParser = lazy(() => creator(validate('<', validate(/^<[a-z]+(?=[^\S\n]|>)/, union([
+  focus(
+    '<wbr>',
+    () => [[h('wbr')], '']),
+  focus(
+    // https://html.spec.whatwg.org/multipage/syntax.html#void-elements
+    /^<(?:area|base|br|col|embed|hr|img|input|link|meta|source|track|wbr)(?=[^\S\n]|>)/,
+    source => [[source], '']),
   match(
-    /^<(wbr)(?=[^\S\n]|>)/,
-    memoize(
-    ([, tag]) =>
-      surround(
-        `<${tag}`, some(union([attribute])), /^\s*>/, true,
-        ([, bs = []], rest) =>
-          [[h(tag as 'span', attributes('html', [], attrspec[tag], bs))], rest]),
-    ([, tag]) => tags.indexOf(tag), [])),
-  match(
-    /^<(sup|sub|small|bdo|bdi)(?=[^\S\n]|>)/,
+    new RegExp(String.raw`^<(${TAGS.join('|')})(?=[^\S\n]|>)`),
     memoize(
     ([, tag]) =>
       surround<HTMLParser.TagParser, string>(surround(
-        str(`<${tag}`), some(attribute), str(/^\s*>/), true),
+        str(`<${tag}`), some(attribute), str(/^[^\S\n]*>/), true),
         startLoose(some(union([
           open(/^\n?/, some(inline, blankWith('\n', `</${tag}>`)), true),
         ])), `</${tag}>`),
         str(`</${tag}>`), false,
         ([as, bs, cs], rest) =>
           [[elem(tag, as, bs, cs)], rest]),
-    ([, tag]) => tags.indexOf(tag), [])),
+    ([, tag]) => TAGS.indexOf(tag), [])),
   match(
     /^<([a-z]+)(?=[^\S\n]|>)/,
     memoize(
     ([, tag]) =>
       surround<HTMLParser.TagParser, string>(surround(
-        str(`<${tag}`), some(attribute), str(/^\s*>/), true),
+        str(`<${tag}`), some(attribute), str(/^[^\S\n]*>/), true),
         startLoose(some(union([
           open(/^\n?/, some(inline, blankWith('\n', `</${tag}>`)), true),
         ])), `</${tag}>`),
@@ -61,16 +59,159 @@ export const attribute: HTMLParser.TagParser.AttributeParser = union([
   str(/^[^\S\n]+[a-z]+(?:-[a-z]+)*(?:="(?:\\[^\n]|[^\\\n"])*")?(?=[^\S\n]|>)/),
 ]);
 
+// https://developer.mozilla.org/en-US/docs/Web/HTML/Element
+// [...document.querySelectorAll('tbody > tr > td:first-child')].map(el => el.textContent.slice(1, -1))
+const TAGS = Object.freeze([
+  "html",
+  "base",
+  "head",
+  "link",
+  "meta",
+  "style",
+  "title",
+  "body",
+  "address",
+  "article",
+  "aside",
+  "footer",
+  "header",
+  "h1", "h2", "h3", "h4", "h5", "h6",
+  "main",
+  "nav",
+  "section",
+  "blockquote",
+  "dd",
+  "div",
+  "dl",
+  "dt",
+  "figcaption",
+  "figure",
+  "hr",
+  "li",
+  "menu",
+  "ol",
+  "p",
+  "pre",
+  "ul",
+  "a",
+  "abbr",
+  "b",
+  "bdi",
+  "bdo",
+  "br",
+  "cite",
+  "code",
+  "data",
+  "dfn",
+  "em",
+  "i",
+  "kbd",
+  "mark",
+  "q",
+  "rp",
+  "rt",
+  "ruby",
+  "s",
+  "samp",
+  "small",
+  "span",
+  "strong",
+  "sub",
+  "sup",
+  "time",
+  "u",
+  "var",
+  "wbr",
+  "area",
+  "audio",
+  "img",
+  "map",
+  "track",
+  "video",
+  "embed",
+  "iframe",
+  "object",
+  "picture",
+  "portal",
+  "source",
+  "svg",
+  "math",
+  "canvas",
+  "noscript",
+  "script",
+  "del",
+  "ins",
+  "caption",
+  "col",
+  "colgroup",
+  "table",
+  "tbody",
+  "td",
+  "tfoot",
+  "th",
+  "thead",
+  "tr",
+  "button",
+  "datalist",
+  "fieldset",
+  "form",
+  "input",
+  "label",
+  "legend",
+  "meter",
+  "optgroup",
+  "option",
+  "output",
+  "progress",
+  "select",
+  "textarea",
+  "details",
+  "dialog",
+  "summary",
+  "slot",
+  "template",
+  "acronym",
+  "applet",
+  "basefont",
+  "bgsound",
+  "big",
+  "blink",
+  "center",
+  "content",
+  "dir",
+  "font",
+  "frame",
+  "frameset",
+  "hgroup",
+  "image",
+  "keygen",
+  "marquee",
+  "menuitem",
+  "nobr",
+  "noembed",
+  "noframes",
+  "param",
+  "plaintext",
+  "rb",
+  "rtc",
+  "shadow",
+  "spacer",
+  "strike",
+  "tt",
+  "xmp",
+]);
+
 function elem(tag: string, as: string[], bs: (HTMLElement | string)[], cs: string[]): HTMLElement {
   assert(as.length > 0);
   assert(as[0][0] === '<' && as[as.length - 1].slice(-1) === '>');
   assert(cs.length === 1);
   if (!tags.includes(tag)) return invalid('tag', `Invalid HTML tag <${tag}>`, as, bs, cs);
-  const attrs = attributes('html', [], attrspec[tag], as.slice(1, -1));
+  const attrs = attributes('html', [], attrspecs[tag], as.slice(1, -1));
   return 'data-invalid-syntax' in attrs
     ? invalid('attribute', 'Invalid HTML attribute', as, bs, cs)
     : h(tag as 'span', attrs, defrag(bs));
 }
+
 function invalid(type: string, message: string, as: (HTMLElement | string)[], bs: (HTMLElement | string)[], cs: (HTMLElement | string)[]): HTMLElement {
   return h('span', {
     class: 'invalid',
@@ -103,7 +244,7 @@ export function attributes(
       ? param.slice(name.length + 2, -1).replace(/\\(.?)/g, '$1')
       : undefined;
     invalid ||= !spec || name in attrs;
-    if (spec && !spec[name] && name in spec) continue;
+    if (spec && name in spec && !spec[name]) continue;
     spec?.[name]?.includes(value) || value !== undefined && spec?.[name]?.length === 0
       ? attrs[name] = value ?? ''
       : invalid ||= !!spec;

package/src/parser/inline/strong.test.ts

@@ -43,7 +43,7 @@ describe('Unit: parser/inline/strong', () => {
       assert.deepStrictEqual(inspect(parser('**a*b*c**')), [['<strong>a<em>b</em>c</strong>'], '']);
       assert.deepStrictEqual(inspect(parser('**a*b*c**d')), [['<strong>a<em>b</em>c</strong>'], 'd']);
       assert.deepStrictEqual(inspect(parser('**`a`**')), [['<strong><code data-src="`a`">a</code></strong>'], '']);
-      assert.deepStrictEqual(inspect(parser('**<small>**')), [['<strong>&lt;small&gt;</strong>'], '']);
+      assert.deepStrictEqual(inspect(parser('**<bdi>**')), [['<strong>&lt;bdi&gt;</strong>'], '']);
       assert.deepStrictEqual(inspect(parser('**(*a*)**')), [['<strong><span class="paren">(<em>a</em>)</span></strong>'], '']);
       assert.deepStrictEqual(inspect(parser('**(**a**)**')), [['<strong><span class="paren">(<strong>a</strong>)</span></strong>'], '']);
     });

package/src/parser/inline.test.ts

@@ -99,8 +99,8 @@ describe('Unit: parser/inline', () => {
       assert.deepStrictEqual(inspect(parser('*++ ++*')), [['<em><ins> </ins></em>'], '']);
       assert.deepStrictEqual(inspect(parser('*++ a ++*')), [['<em><ins> a </ins></em>'], '']);
       assert.deepStrictEqual(inspect(parser('*++  a  ++*')), [['<em><ins>  a  </ins></em>'], '']);
-      assert.deepStrictEqual(inspect(parser('*<small>`a`</small>*')), [['<em><small><code data-src="`a`">a</code></small></em>'], '']);
-      assert.deepStrictEqual(inspect(parser('<small>*<bdi>a</bdi>*</small>')), [['<small><em><bdi>a</bdi></em></small>'], '']);
+      assert.deepStrictEqual(inspect(parser('*<bdi>`a`</bdi>*')), [['<em><bdi><code data-src="`a`">a</code></bdi></em>'], '']);
+      assert.deepStrictEqual(inspect(parser('<bdi>*<bdi>a</bdi>*</bdi>')), [['<bdi><em><bdi>a</bdi></em></bdi>'], '']);
       assert.deepStrictEqual(inspect(parser('<bdi>((<bdi>((a))</bdi>))</bdi>')), [['<bdi><sup class="annotation"><span><bdi><span class="paren">((a))</span></bdi></span></sup></bdi>'], '']);
       assert.deepStrictEqual(inspect(parser('<bdi>[[<bdi>[[a]]</bdi>]]</bdi>')), [['<bdi><sup class="reference"><span><bdi>[[a]]</bdi></span></sup></bdi>'], '']);
       assert.deepStrictEqual(inspect(parser('*[*]')), [['*', '[', '*', ']'], '']);
@@ -155,9 +155,8 @@ describe('Unit: parser/inline', () => {
       assert.deepStrictEqual(inspect(parser('[(([a]{#}))]{#}')), [['<a href="#"><span class="paren">(<span class="paren">([a]{#})</span>)</span></a>'], '']);
       assert.deepStrictEqual(inspect(parser('"[[""]]')), [['"', '<sup class="reference"><span>""</span></sup>'], '']);
       assert.deepStrictEqual(inspect(parser('<http://host>')), [['<', '<a href="http://host" target="_blank">http://host</a>', '>'], '']);
-      assert.deepStrictEqual(inspect(parser('<<small>a<</small>')), [['<', '<small>a&lt;</small>'], '']);
-      assert.deepStrictEqual(inspect(parser('<sup><sub>a</sub>')), [['<', 'sup', '>', '<sub>a</sub>'], '']);
-      assert.deepStrictEqual(inspect(parser('*<small>*`</small>`')), [['<em>&lt;small&gt;</em>', '<code data-src="`</small>`">&lt;/small&gt;</code>'], '']);
+      assert.deepStrictEqual(inspect(parser('<<bdi>a<</bdi>')), [['<', '<bdi>a&lt;</bdi>'], '']);
+      assert.deepStrictEqual(inspect(parser('*<bdi>*`</bdi>`')), [['<em>&lt;bdi&gt;</em>', '<code data-src="`</bdi>`">&lt;/bdi&gt;</code>'], '']);
       assert.deepStrictEqual(inspect(parser('[~http://host')), [['[', '~', '<a href="http://host" target="_blank">http://host</a>'], '']);
       assert.deepStrictEqual(inspect(parser('[~a@b')), [['[', '~', '<a class="email" href="mailto:a@b">a@b</a>'], '']);
       assert.deepStrictEqual(inspect(parser('[~~a~~]')), [['[', '<del>a</del>', ']'], '']);

package/src/parser/processor/figure.ts

@@ -6,14 +6,11 @@ import { push } from 'spica/array';
 
 export function* figure(
   target: ParentNode & Node,
-  footnotes?: Readonly<{ annotations?: HTMLOListElement; references: HTMLOListElement; }>,
-  opts: Readonly<{
-    id?: string;
-  }> = {},
+  footnotes?: { readonly references: HTMLOListElement; },
+  opts: { readonly id?: string; } = {},
 ): Generator<HTMLAnchorElement | undefined, undefined, undefined> {
-  const refs = new MultiMap<string, HTMLAnchorElement>(push(push(push([],
+  const refs = new MultiMap<string, HTMLAnchorElement>(push(push([],
     target.querySelectorAll('a.label:not(.disabled)[data-label]')),
-    footnotes?.annotations?.querySelectorAll('a.label:not(.disabled)') ?? []),
     footnotes?.references.querySelectorAll('a.label:not(.disabled)') ?? [])
     .map(el => [el.getAttribute('data-label')!, el]));
   const labels = new Set<string>();

package/src/parser/processor/footnote.ts

@@ -6,11 +6,12 @@ import { push } from 'spica/array';
 
 export function* footnote(
   target: ParentNode & Node,
-  footnotes?: Readonly<{ annotations?: HTMLOListElement; references: HTMLOListElement; }>,
-  opts: Readonly<{ id?: string; }> = {},
+  footnotes?: { readonly annotations?: HTMLOListElement; readonly references: HTMLOListElement; },
+  opts: { readonly id?: string; } = {},
+  bottom: Node | null = null,
 ): Generator<HTMLAnchorElement | HTMLLIElement | undefined, undefined, undefined> {
-  yield* reference(target, footnotes?.references, opts);
-  yield* annotation(target, footnotes?.annotations, opts);
+  yield* reference(target, footnotes?.references, opts, bottom);
+  yield* annotation(target, footnotes?.annotations, opts, bottom);
   return;
 }
 
@@ -28,9 +29,9 @@ function build(
   return function* (
     target: ParentNode & Node,
     footnote?: HTMLOListElement,
-    opts: Readonly<{ id?: string }> = {},
+    opts: { readonly id?: string } = {},
+    bottom: Node | null = null,
   ): Generator<HTMLAnchorElement | HTMLLIElement | undefined, undefined, undefined> {
-    //assert(syntax !== 'annotation' || !footnote);
     const defs = new Map<string, HTMLLIElement>();
     const buffer = new MultiMap<string, HTMLElement>();
     const titles = new Map<string, string>();
@@ -148,7 +149,7 @@ function build(
           `^${refIndex}`));
     }
     if (defs.size > 0 || footnote) {
-      yield* proc(defs, footnote ?? target.insertBefore(html('ol', { class: `${syntax}s` }), splitters[0] ?? target.querySelector(':scope > :is(#annotations, #references)')));
+      yield* proc(defs, footnote ?? target.insertBefore(html('ol', { class: `${syntax}s` }), splitters[0] ?? bottom));
     }
     return;
   }

package/src/renderer/render/code.ts

@@ -1,7 +1,7 @@
 import Prism from 'prismjs';
-import { Collection } from 'spica/collection';
+import { Dict } from 'spica/dict';
 
-export function code(target: HTMLElement, cache?: Collection<string, HTMLElement>): void {
+export function code(target: HTMLElement, cache?: Dict<string, HTMLElement>): void {
   assert(target.children.length === 0);
   const source = target.textContent!;
   Prism.highlightElement(target, false, () =>

package/src/renderer/render/math.ts

@@ -1,8 +1,8 @@
 import { undefined } from 'spica/global';
-import { Collection } from 'spica/collection';
+import { Dict } from 'spica/dict';
 import { html, define } from 'typed-dom/dom';
 
-export function math(target: HTMLElement, cache?: Collection<string, HTMLElement>): void {
+export function math(target: HTMLElement, cache?: Dict<string, HTMLElement>): void {
   assert(target.children.length === 0);
   const source = target.textContent!;
   queue(target, () => {

package/src/renderer/render/media/image.ts

@@ -1,8 +1,8 @@
 import { Object } from 'spica/global';
-import { Collection } from 'spica/collection';
+import { Dict } from 'spica/dict';
 import { define } from 'typed-dom/dom';
 
-export function image(source: HTMLImageElement, url: URL, cache?: Collection<string, HTMLElement>): HTMLImageElement {
+export function image(source: HTMLImageElement, url: URL, cache?: Dict<string, HTMLElement>): HTMLImageElement {
   if (cache?.has(url.href)) return define(
     cache.get(url.href)!.cloneNode(true) as HTMLImageElement,
     Object.fromEntries([...source.attributes]

package/src/renderer/render/media.ts

@@ -5,7 +5,7 @@ import { pdf } from './media/pdf';
 import { video } from './media/video';
 import { audio } from './media/audio';
 import { image } from './media/image';
-import { Collection } from 'spica/collection';
+import { Dict } from 'spica/dict';
 import { ReadonlyURL } from 'spica/url';
 import { reduce } from 'spica/memoize';
 
@@ -14,7 +14,7 @@ type MediaOptions = NonNullable<RenderingOptions['media']>;
 const extend = reduce((opts: MediaOptions): MediaOptions =>
   ({ twitter, youtube, pdf, video, audio, image, ...opts }));
 
-export function media(base: string, source: HTMLImageElement, opts: MediaOptions, cache?: Collection<string, HTMLElement>): HTMLElement | undefined {
+export function media(base: string, source: HTMLImageElement, opts: MediaOptions, cache?: Dict<string, HTMLElement>): HTMLElement | undefined {
   assert(source.matches('img:not([src])[data-src]'));
   opts = extend(opts);
   const url = new ReadonlyURL(source.getAttribute('data-src')!, base);