@speed-highlight/core
Advanced tools
Comparing version 1.1.7 to 1.1.8
@@ -1,14 +0,60 @@ | ||
import { setTheme, printHighlight } from '../src/term.js'; | ||
import { languages, themesTerminal } from './data.js' | ||
import { setTheme, printHighlight } from '../src/terminal.js'; | ||
import { fromFileUrl } from 'https://deno.land/std/path/mod.ts'; | ||
import { parse } from "https://deno.land/std/flags/mod.ts" | ||
const lang = Deno.args[0] ?? 'js'; | ||
let args = parse(Deno.args) | ||
const path = fromFileUrl(import.meta.url.replace(/[^\\\/]+$/, `languages/test.${lang}`)) | ||
if (args.help) | ||
{ | ||
console.log(`Usage deno run --allow-read deno.js [OPTION]... [TEST_FILE]`) | ||
console.log(``) | ||
console.log(` --help display this help and exit`) | ||
console.log(` --theme=[-]THEME change the used THEME`) | ||
console.log(` --lang=[-]LANGUAGE change the used LANGUAGE`) | ||
console.log(` --stdin highlight code given from the stdin`) | ||
console.log(``) | ||
console.log(`THEME may be:`) | ||
console.log(`${themesTerminal.join(', ')}`) | ||
console.log(`LANGUAGE may be:`) | ||
console.log(`${languages.join(', ')}`) | ||
Deno.exit(0) | ||
} | ||
if (args.theme) | ||
{ | ||
if (!themesTerminal.includes(args.theme)) | ||
{ | ||
console.error(`'${args.theme}' is not a supported try on of the following theme:`) | ||
console.log(`${themesTerminal.join(', ')}`) | ||
Deno.exit(1) | ||
} | ||
await setTheme(args.theme) | ||
} | ||
if (args.lang && !languages.includes(args.lang)) | ||
{ | ||
console.error(`'${args.lang}' is not a supported try on of the following languages:`) | ||
console.log(`${languages.join(', ')}`) | ||
Deno.exit(1) | ||
} | ||
if (args.stdin) | ||
{ | ||
const buf = new Uint8Array(1024) | ||
let n; | ||
do { | ||
n = await Deno.stdin.read(buf) | ||
const code = new TextDecoder().decode(buf.subarray(0, n)) | ||
await printHighlight(code, args.lang ?? 'js'); | ||
} while (n) | ||
Deno.exit(0) | ||
} | ||
const absolutePath = args._[0] ?? fromFileUrl(import.meta.url.replace(/[^\\\/]+$/, './languages/test.js')) | ||
.replace(Deno.cwd(), '') | ||
.slice(1) | ||
const code = await Deno.readTextFile(path); | ||
const code = await Deno.readTextFile(absolutePath); | ||
await setTheme('default'); | ||
printHighlight(code, lang); | ||
printHighlight(code, args.lang ?? args._[0]?.split?.('.')?.[1] ?? 'js'); |
const fs = require('fs'), | ||
path = require('path'), | ||
{ setTheme, printHighlight } = require('../dist/node/term.js'); | ||
{ setTheme, printHighlight } = require('@speed-highlight/core/terminal'); | ||
@@ -5,0 +5,0 @@ const lang = process.argv[2] ?? 'js'; |
{ | ||
"name": "@speed-highlight/core", | ||
"version": "1.1.7", | ||
"description": "🌈 Light, fast, and easy to use, dependencies free javascript syntax highlighter, with automatic language detection", | ||
"main": "dist/node/index.js", | ||
"directories": { | ||
"example": "examples" | ||
}, | ||
"scripts": { | ||
"test": "echo \"Error: no test specified\" && exit 1" | ||
}, | ||
"repository": { | ||
"type": "git", | ||
"url": "git://github.com/speed-highlight/core.git" | ||
}, | ||
"keywords": [ | ||
"javascript", | ||
"syntax-highlighting", | ||
"language", | ||
"fast", | ||
"js", | ||
"simple", | ||
"highlighter", | ||
"regex", | ||
"highlighting", | ||
"highlightjs", | ||
"small", | ||
"deno" | ||
], | ||
"author": "matubu", | ||
"license": "CC0-1.0", | ||
"bugs": { | ||
"url": "https://github.com/speed-highlight/core/issues" | ||
}, | ||
"homepage": "https://github.com/speed-highlight/core#readme", | ||
"publishConfig": { | ||
"registry": "https://npm.pkg.github.com/", | ||
"access": "public" | ||
} | ||
"name": "@speed-highlight/core", | ||
"version": "1.1.8", | ||
"description": "🌈 Light, fast, and easy to use, dependencies free javascript syntax highlighter, with automatic language detection", | ||
"main": "dist/node/index.js", | ||
"exports": { | ||
"./terminal": "./dist/node/terminal.js", | ||
"./terminal.js": "./dist/node/terminal.js" | ||
}, | ||
"directories": { | ||
"example": "examples" | ||
}, | ||
"scripts": { | ||
"build": "./.github/workflows/minify.sh" | ||
}, | ||
"repository": { | ||
"type": "git", | ||
"url": "git://github.com/speed-highlight/core.git" | ||
}, | ||
"keywords": [ | ||
"javascript", | ||
"syntax-highlighting", | ||
"language", | ||
"fast", | ||
"js", | ||
"simple", | ||
"highlighter", | ||
"regex", | ||
"highlighting", | ||
"highlightjs", | ||
"small", | ||
"deno" | ||
], | ||
"author": "matubu", | ||
"license": "CC0-1.0", | ||
"bugs": { | ||
"url": "https://github.com/speed-highlight/core/issues" | ||
}, | ||
"homepage": "https://github.com/speed-highlight/core#readme", | ||
"publishConfig": { | ||
"registry": "https://npm.pkg.github.com/", | ||
"access": "public" | ||
} | ||
} |
@@ -49,2 +49,9 @@ # Speed-highlight JS | ||
Load custom language | ||
```js | ||
import { loadLanguage } from '../src/index.js'; | ||
loadLanguage('language-name', customLanguage); | ||
``` | ||
#### CDN | ||
@@ -66,6 +73,6 @@ | ||
```js | ||
import { setTheme, printHighlight } from 'https://x.nest.land/speed_highlight_js/dist/term.js'; | ||
import { setTheme, printHighlight } from 'https://x.nest.land/speed_highlight_js/dist/terminal.js'; | ||
await setTheme('default'); | ||
printHighlight('console.log("hello")', 'js'); | ||
await setTheme('[theme-name]') | ||
printHighlight('console.log("hello")', 'js') | ||
``` | ||
@@ -82,8 +89,48 @@ | ||
```js | ||
const { setTheme, printHighlight } = require('@speed-highlight/core/dist/node/term.js'); | ||
const { setTheme, printHighlight } = require('@speed-highlight/core/terminal.js'); | ||
setTheme('default') | ||
printHighlight('console.log("hello")', 'js'); | ||
setTheme('[theme-name]') | ||
printHighlight('console.log("hello")', 'js') | ||
``` | ||
## Migrating from prism | ||
Speed-highlight JS is a lighter and faster version of prism that share a similar API | ||
### Style | ||
Remove the prism stylesheet in the head of your html file | ||
Clone this repository or use a cdn to load our stylesheet | ||
```diff | ||
<head> | ||
- <link href="themes/prism.css" rel="stylesheet" /> | ||
+ <link rel="stylesheet" href="https://unpkg.com/@speed-highlight/core/dist/themes/default.css"> | ||
</head> | ||
``` | ||
### Script | ||
For the script part remove the prism.js script and replace it by a import and a call to `highlightAll` | ||
```diff | ||
<body> | ||
- <script src="prism.js"></script> | ||
+<script> | ||
+ import { highlightAll } from 'https://unpkg.com/@speed-highlight/core/dist/index.js' | ||
+ highlightAll() | ||
+</script> | ||
</body> | ||
``` | ||
If you want to highlight only a specific element you can use the `highlightElement` function instead | ||
### Code block | ||
For the code blocks replace the `<pre><code>` by only one `<div>` | ||
And use `shj-lang-` prefix instead of `language-` for the class property | ||
```diff | ||
-<pre><code class="language-css">p { color: red }</code></pre> | ||
+<div class="shj-lang-css">p { color: red }</div> | ||
``` | ||
And for inline code block you just have to change the class property | ||
```diff | ||
-<code class="language-css">p { color: red }</code> | ||
+<code class="shj-lang-css">p { color: red }</code> | ||
``` | ||
## Languages supported 🌐 | ||
@@ -138,8 +185,8 @@ | ||
| github-dim | ❌ | ✅ | | ||
| atom-dark | ❌ | ✅ | | ||
| atom-dark | ✅ | ✅ | | ||
| visual-studio-dark | ❌ | ✅ | | ||
## Wiki 👀 | ||
## Documentation 👀 | ||
Further in-depth documentation for the API and other topics is in our [Wiki](https://github.com/speed-highlight/core/wiki) | ||
Further in-depth documentation for the API and other topics is in our [Wiki](https://github.com/speed-highlight/core/wiki) and our [Documentation](https://speed-highlight.github.io/core/doc/) | ||
@@ -146,0 +193,0 @@ ## License 📃 |
@@ -0,1 +1,11 @@ | ||
/** | ||
* @module detect | ||
* (Language detector) | ||
*/ | ||
import '../typedef.js' | ||
/** | ||
* @type {Array.<[ShjLanguage, ...[RegExp, Number][]]>} | ||
*/ | ||
const languages = [ | ||
@@ -25,10 +35,16 @@ ['bash', [/#!(\/usr)?\/bin\/bash/g, 500], [/\b(if|elif|then|fi|echo)\b|\$/g, 10]], | ||
/** | ||
* @function detectLanguage | ||
* Try to find the language the given code belong to | ||
* @param {String} code The code | ||
* @returns {ShjLanguage} The language of the code | ||
*/ | ||
export const detectLanguage = code => { | ||
return (languages | ||
.map(([lang, ...features]) => [ | ||
features.reduce((acc, [match, score]) => acc + [...code.matchAll(match)].length * score, 0), | ||
lang | ||
lang, | ||
features.reduce((acc, [match, score]) => acc + [...code.matchAll(match)].length * score, 0) | ||
]) | ||
.filter(([score, lang]) => score > 10) | ||
.sort((a, b) => b[0] - a[0])[0]?.[1] || 'plain'); | ||
} | ||
.filter(([lang, score]) => score > 20) | ||
.sort((a, b) => b[1] - a[1])[0]?.[0] || 'plain'); | ||
} |
/** | ||
* Base script | ||
* @module index | ||
* (Base script) | ||
*/ | ||
import '../typedef.js' | ||
import expandData from './common.js'; | ||
@@ -11,6 +14,8 @@ | ||
/** | ||
* A function that turn text in HTML to apply a class to it | ||
* @param {String} str need to be sanitize to be safe | ||
* @param {String} [token] token type | ||
* @returns A string with HTML semantics | ||
* @function | ||
* @ignore | ||
* Create a HTML element with the right token styling | ||
* @param {String} str The content (need to be sanitized) | ||
* @param {ShjToken} [token] The type of token | ||
* @returns A HMTL string | ||
*/ | ||
@@ -20,9 +25,10 @@ toSpan = (str, token) => token ? `<span class="shj-syn-${token}">${str}</span>` : str; | ||
/** | ||
* A | ||
* @param {String} src | ||
* @param {String|Object} lang | ||
* @param {Function} token the callback that will be call for every token found. | ||
* the arguments pass will be: | ||
* * the token as a string (can be an empty string) | ||
* * the token type also as a string like 'err', 'cmnt', ... | ||
* @function tokenize | ||
* Find the tokens in the given code and call the callback | ||
* @param {String} src The code | ||
* @param {ShjLanguage|Array} lang The language of the code | ||
* @param {function(String, ShjToken=):void} token The callback function | ||
* this function will be given | ||
* * the text of the token | ||
* * the type of the token | ||
*/ | ||
@@ -84,16 +90,12 @@ export async function tokenize(src, lang, token) { | ||
/** | ||
* @typedef {Object} HighlightOptions | ||
* @property {boolean} [hideLineNumbers=false] - Indicates whether to hide line numbers. | ||
*/ | ||
/** | ||
* @function highlightText | ||
* @async | ||
* @function highlightText A function that highlight a string text and return it | ||
* Highlight a string passed as argument and return it | ||
* @example | ||
* elm.innerHTML = await highlightText(code, 'js'); | ||
* @param {String} src the text content to be highlighted | ||
* @param {String} lang the lang name ex: 'js' | ||
* @param {Boolean} [multiline=true] inline mode | ||
* @param {HighlightOptions} [opt={}] other options | ||
* @returns {String} the highlighted as String text | ||
* @param {String} src The code | ||
* @param {ShjLanguage} lang The language of the code | ||
* @param {Boolean} [multiline=true] If it is multiline, it will add a wrapper for the line numbering and header | ||
* @param {ShjOptions} [opt={}] Customization options | ||
* @returns {Promise<String>} The highlighted string | ||
*/ | ||
@@ -110,8 +112,9 @@ export async function highlightText(src, lang, multiline = true, opt = {}) { | ||
/** | ||
* @function highlightElement | ||
* @async | ||
* @function highlightElement highlight a element code with a 'pre' parent | ||
* @param {HTMLElement} elm the code elm | ||
* @param {String} [lang] the lang used for syntax highlighting by default is found in the className of the parent or the elm it self | ||
* @param {String} [mode] can be set to inline multiline or oneline by default it's auto detected: inline if `code` tag else depends of the number of lines | ||
* @param {HighlightOptions} [opt={}] other options | ||
* Highlight a DOM element by getting the new innerHTML with highlightText | ||
* @param {Element} elm The DOM element | ||
* @param {ShjLanguage} [lang] The language of the code (seaching by default on `elm` for a 'shj-lang-' class) | ||
* @param {ShjDisplayMode} [mode] The display mode (guessed by default) | ||
* @param {ShjOptions} [opt={}] Customization options | ||
*/ | ||
@@ -127,13 +130,6 @@ export async function highlightElement(elm, lang = elm.className.match(/shj-lang-([\w-]+)/)?.[1], mode, opt) { | ||
/** | ||
* @function highlightAll | ||
* @async | ||
* @function highlightAll | ||
* for all element that have a class name starting with "shj-lang-" | ||
* this function will call highlightElement with the html element as argument | ||
* The function will select those scheme for example: | ||
* ```html | ||
* <div class='shj-lang-[code-language]'>[code]</div> | ||
* or | ||
* <code class='shj-lang-[code-language]'>[inline code]</code> | ||
* ``` | ||
* @param {HighlightOptions} [opt={}] other options | ||
* Call highlightElement on element with a css class starting with `shj-lang-` | ||
* @param {ShjOptions} [opt={}] Customization options | ||
*/ | ||
@@ -144,1 +140,11 @@ export let highlightAll = async (opt) => | ||
.forEach(elm => highlightElement(elm, undefined, undefined, opt)) | ||
/** | ||
* @function loadLanguage | ||
* Load a language and add it to the langs object | ||
* @param {String} languageName The name of the language | ||
* @param {ShjLanguage} language The language | ||
*/ | ||
export let loadLanguage = (languageName, language) => { | ||
langs[languageName] = language; | ||
} |
@@ -50,4 +50,4 @@ export default [ | ||
type: 'class', | ||
match: /[A-Z][\w_]*/g | ||
match: /\b[A-Z][\w_]*\b/g | ||
} | ||
] |
@@ -22,3 +22,3 @@ export default [ | ||
type: 'class', | ||
match: /[A-Z][\w_]*/g | ||
match: /\b[A-Z][\w_]*\b/g | ||
}, | ||
@@ -25,0 +25,0 @@ { |
@@ -26,4 +26,4 @@ export default [ | ||
type: 'class', | ||
match: /[A-Z][\w_]*/g | ||
match: /\b[A-Z][\w_]*\b/g | ||
} | ||
] |
@@ -42,3 +42,3 @@ export default [ | ||
type: 'class', | ||
match: /\b[A-Z]\w*\b/g | ||
match: /\b[A-Z][\w_]*\b/g | ||
}, | ||
@@ -45,0 +45,0 @@ { |
@@ -50,4 +50,4 @@ export default [ | ||
type: 'class', | ||
match: /\b[A-Z]\w*\b/g | ||
match: /\b[A-Z][\w_]*\b/g | ||
} | ||
] |
@@ -22,3 +22,3 @@ export default [ | ||
type: 'class', | ||
match: /\b[A-Z]\w*\b/g | ||
match: /\b[A-Z][\w_]*\b/g | ||
}, | ||
@@ -25,0 +25,0 @@ { |
@@ -1,26 +0,18 @@ | ||
const black = '\x1b[30m', | ||
red = '\x1b[31m', | ||
green = '\x1b[32m', | ||
gray = '\x1b[90m', | ||
yellow = '\x1b[33m', | ||
blue = '\x1b[34m', | ||
magenta = '\x1b[35m', | ||
cyan = '\x1b[36m', | ||
white = '\x1b[37m'; | ||
import col from '../color.js' | ||
export default { | ||
deleted: red, | ||
var: red, | ||
err: red, | ||
kwd: red, | ||
num: yellow, | ||
class: yellow, | ||
cmnt: gray, | ||
insert: green, | ||
str: green, | ||
bool: cyan, | ||
type: blue, | ||
oper: blue, | ||
section: magenta, | ||
func: magenta | ||
}; | ||
deleted: col.red, | ||
var: col.red, | ||
err: col.red, | ||
kwd: col.red, | ||
num: col.yellow, | ||
class: col.yellow, | ||
cmnt: col.gray, | ||
insert: col.green, | ||
str: col.green, | ||
bool: col.cyan, | ||
type: col.blue, | ||
oper: col.blue, | ||
section: col.magenta, | ||
func: col.magenta | ||
} |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Network access
Supply chain riskThis module accesses the network.
Found 1 instance in 1 package
Mixed license
License(Experimental) Package contains multiple licenses.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Dynamic require
Supply chain riskDynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.
Found 1 instance in 1 package
Minified code
QualityThis package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.
Found 1 instance in 1 package
No tests
QualityPackage does not have any tests. This is a strong signal of a poorly maintained or low quality package.
Found 1 instance in 1 package
0
192
1
219244
114
1
1903
2