@pacem/pacem-ui 1.1.0-sierpinski → 2.0.0-abel

package/dist/browser/pacem-ui.js

@@ -1,5 +1,5 @@
 /*!
- * @pacem/pacem-ui v1.1.0-sierpinski (https://js.pacem.it)
+ * @pacem/pacem-ui v2.0.0-abel (https://js.pacem.it)
  * Pacem (https://pacem.it)
  * Licensed under Apache-2.0
  */
@@ -3989,156 +3989,6 @@ css-class="{{ ['hour-start-'+ (^item.hour + 1), 'hour-end-'+ (^item.hour + ^item
     ], PacemLoaderElement);
 
     //namespace Pacem {
-    const match = (input, pattern, fn) => {
-        const arr = pattern.exec(input);
-        if (arr && arr.length) {
-            return fn(arr);
-        }
-        return null;
-    };
-    const MARKUP_RULES = [
-        {
-            // comment
-            exec: (input) => match(input, /^((<|&lt;)!--(?:(?!(--(>|&gt;)))[\s\S])*(--(?:>|&gt;)|$))/, arr => {
-                const raw = arr[0], text = raw;
-                return [{
-                        type: 'code-comment', raw, text, index: arr.index
-                    }];
-            })
-        },
-        {
-            // opening/self-closing tag
-            exec: (input, lexer) => match(input, /^(<|&lt;)([\w-]+)(?:\s+[\w-]+(?:=(?:'[^']*'|"[^"]*"))*)*(\s*\/?(?:&gt;|>))/, arr => {
-                const openingTag = arr[1], tagName = arr[2], closingTag = arr[3];
-                const closingTagIndex = arr[0].length - closingTag.length, attributesIndex = openingTag.length + tagName.length, attributesString = input.substring(attributesIndex, closingTagIndex);
-                const attributes = lexer.tokenize(attributesString, [{
-                        exec: (input) => match(input, /^(\s+[\w-]+)(=('[^']*'|"[^"]*"))?/, arr => {
-                            const raw = arr[1];
-                            const output = [{
-                                    type: 'code-attribute', raw, text: raw, index: arr[0].indexOf(raw)
-                                }];
-                            if (arr.length > 2) {
-                                output.push({
-                                    type: 'code-string', raw: arr[2], text: arr[2], index: arr.index + arr[0].length - arr[2].length
-                                });
-                            }
-                            return output;
-                        })
-                    }]);
-                const retval = [{
-                        type: 'code-tag', raw: openingTag, text: openingTag, index: 0
-                    }, {
-                        type: 'code-tagname', raw: tagName, text: tagName, index: openingTag.length
-                    }];
-                // attributes
-                Array.prototype.push.apply(retval, attributes);
-                retval.push({
-                    type: 'code-tag', raw: closingTag, text: closingTag, index: closingTagIndex
-                });
-                return retval;
-            })
-        },
-        {
-            // closing tag
-            exec: (input) => match(input, /^((?:<|&lt;)\/)([\w-]+)(\s*(?:&gt;|>))/, arr => {
-                const openingTag = arr[1], tagName = arr[2], closingTag = arr[3];
-                return [{
-                        type: 'code-tag', raw: openingTag, text: openingTag, index: 0
-                    }, {
-                        type: 'code-tagname', raw: tagName, text: tagName, index: openingTag.length
-                    }, {
-                        type: 'code-tag', raw: closingTag, text: closingTag, index: arr.index + arr[0].length - closingTag.length
-                    }];
-            })
-        },
-        {
-            // text
-            exec: (input) => match(input, /^(<|&lt;)?((?!<|&lt;).)+/, arr => {
-                const raw = arr[0], text = raw;
-                return [{
-                        type: 'text', raw, text
-                    }];
-            })
-        }
-    ];
-    const C_LIKE_RULES = [{
-            // comments
-            exec: (input, _) => match(input, /^\/\/.*/, arr => {
-                const raw = arr[0], text = raw;
-                return [{
-                        type: 'code-comment', raw, text
-                    }];
-            })
-        }, {
-            exec: (input, _) => match(input, /^\/\*(?:(?!(\*\/))[\s\S])*(?:\*\/|$)/, arr => {
-                const raw = arr[0], text = raw;
-                return [{
-                        type: 'code-comment', raw, text
-                    }];
-            })
-        }, {
-            // string literal
-            exec: (input, _) => match(input, /^('(\\'|[^'])*[^\\]?'|@?\$?"(\\"|[^"])*[^\\]?")/, arr => {
-                const raw = arr[0], text = raw;
-                return [{
-                        type: 'code-string', raw, text
-                    }];
-            })
-        }, {
-            // keywords
-            exec: (input, _) => match(input, /^\b(abstract|as|base|bool|break|byte|case|catch|char|checked|class|const|continue|decimal|default|delegate|do|double|else|enum|event|explicit|extern|false|finally|fixed|float|for|foreach|goto|if|implicit|in|int|interface|internal|is|lock|long|namespace|new|null|object|operator|out|out|override|params|private|protected|public|readonly|ref|return|sbyte|sealed|short|sizeof|stackalloc|static|string|struct|switch|this|throw|true|try|typeof|uint|ulong|unchecked|unsafe|ushort|using|static|virtual|void|volatile|while|add|alias|ascending|async|await|descending|dynamic|from|get|global|group|into|join|let|nameof|orderby|partial|remove|select|set|value|var|when|where|yield)\b/, arr => {
-                const raw = arr[0], text = raw;
-                return [{
-                        type: 'code-keyword', raw, text
-                    }];
-            })
-        }, {
-            // number 
-            exec: (input, _) => match(input, /^\b((0x[0-9a-fA-F]|[\d])*\.?[\d]+)\b/, arr => {
-                const raw = arr[0], text = raw;
-                return [{
-                        type: 'code-number', raw, text
-                    }];
-            })
-        }, {
-            // variables, operators, parentheses
-            exec: (input, _) => match(input, /^(@?\w+|:|\?\??|\?=?|\|\|?|&&?|&=?|;|,|=|\*=?|--|-=?|\+\+|\+=?|\/=?|\^|\(|\[|\)|\]|\{|\})/, arr => {
-                const raw = arr[0], text = raw;
-                return [{
-                        type: 'text', raw, text
-                    }];
-            }),
-        }, {
-            // spaces
-            exec: (input, _) => match(input, /^\s+/, arr => {
-                const raw = arr[0], text = raw;
-                return [{
-                        type: 'space', raw, text
-                    }];
-            }),
-        }];
-    const SCRIPT_RULES = [
-        C_LIKE_RULES[0], C_LIKE_RULES[1], {
-            // string literal
-            exec: (input, _) => match(input, /^('(\\'|[^'])*[^\\]?'|"(\\"|[^"])*[^\\]?"|`(\\`|[^`])*[^\\]?`)/, arr => {
-                const raw = arr[0], text = raw;
-                return [{
-                        type: 'code-string', raw, text
-                    }];
-            })
-        }, {
-            // keywords
-            exec: (input, _) => match(input, /^\b(abstract|any|arguments|async|await|boolean|break|byte|case|catch|char|class|const|continue|debugger|declare|default|delete|do|double|else|enum|eval|export|extends|false|final|finally|float|for|function|get|goto|if|implements|import|in|instanceof|int|interface|let|long|native|new|null|number|package|private|protected|public|return|short|static|string|super|switch|synchronized|this|throw|throws|transient|true|try|type|typeof|var|void|volatile|while|with|yield)\b/, arr => {
-                const raw = arr[0], text = raw;
-                return [{
-                        type: 'code-keyword', raw, text
-                    }];
-            })
-        },
-        C_LIKE_RULES[4],
-        C_LIKE_RULES[5],
-        C_LIKE_RULES[6]
-    ];
     const TWITTER_RULE = {
         rule: {
             exec: (input) => {
@@ -4177,39 +4027,18 @@ css-class="{{ ['hour-start-'+ (^item.hour + 1), 'hour-end-'+ (^item.hour + ^item
             case 'tweet':
                 return `<!-- twitter embed -->
 <${pacemCore.P}-tweetembed tweetid="${token.text}"></${pacemCore.P}-tweetembed>`;
-            // code
-            case 'code-string':
-            case 'code-keyword':
-            case 'code-number':
-            case 'code-comment':
-            case 'code-tag':
-            case 'code-tagname':
-            case 'code-attribute':
-                return `<span class="${token.type}">${token.text}</span>`;
         }
     };
-    /** Parses Markdown into HTML, extended with C-like/script/markup code-fence highlighting and Pacem-specific inline embeds (`{tweet}(id)`, `{yt}(id)`). */
+    /**
+     * Parses Markdown into HTML, extended with Pacem-specific inline embeds (`{tweet}(id)`, `{yt}(id)`).
+     * Fenced code blocks are highlighted by the language-agnostic `Compile.Scanner`, for every language registered in
+     * `Compile.Syntaxes` (built-in: javascript/typescript, html/xml, c#, c/c++, json; more can be registered at runtime).
+     */
     class MarkdownService {
-        constructor() {
-            const grammar = [
-                TWITTER_RULE,
-                YOUTUBE_RULE
-            ];
-            for (let lang of ['c-sharp', 'c', 'c#', 'csharp', 'c++', 'cpp']) {
-                const c_like_rules = C_LIKE_RULES.map(rule => { return { rule, lang, type: 'code' }; });
-                Array.prototype.push.apply(grammar, c_like_rules);
-            }
-            for (let lang of ['ts', 'js', 'typescript', 'javascript']) {
-                const script_rules = SCRIPT_RULES.map(rule => { return { rule, lang, type: 'code' }; });
-                Array.prototype.push.apply(grammar, script_rules);
-            }
-            for (let lang of ['xml', 'html']) {
-                const markup_rules = MARKUP_RULES.map(rule => { return { rule, lang, type: 'code' }; });
-                Array.prototype.push.apply(grammar, markup_rules);
-            }
-            this.#grammar = grammar;
-        }
-        #grammar;
+        #grammar = [
+            TWITTER_RULE,
+            YOUTUBE_RULE
+        ];
         #md = new pacemFoundation.Compile.Markdown.Parser();
         _escape(md) {
             // no html allowed
@@ -4217,11 +4046,13 @@ css-class="{{ ['hour-start-'+ (^item.hour + 1), 'hour-end-'+ (^item.hour + ^item
         }
         /** Converts the given Markdown source into an HTML string. */
         toHtml(md) {
-            return this.#md.toHtml(this._escape(md), this.#grammar, RULES_TO_HTML);
+            const escaped = this._escape(md);
+            return this.#md.toHtml(escaped, this.#grammar, RULES_TO_HTML);
         }
         /** Tokenizes the given Markdown source, without rendering it to HTML. */
         tokenize(md) {
-            return this.#md.tokenize(this._escape(md), this.#grammar);
+            const escaped = this._escape(md);
+            return this.#md.tokenize(escaped, this.#grammar);
         }
     }