Directory

Code Block - Vaadin Add-on Directory

Code block and highlighting using Prism. Code Block - Vaadin Add-on Directory
# Code Block. Vaadin mapping for my [<code-block>](https://github.com/oliveryasuna/code-block) element. ## Getting Started Creating a new `` element is easy. ```java new CodeBlock(Language.JAVASCRIPT, "" + "function print(msg) {\n" + " console.log(msg);\n" + "}\n" + "\n" + "print('Hello, World!');"); ``` You can specify the theme. ```java new CodeBlock(Language.JAVASCRIPT, Theme.PRISM_TOMORROW, "" + "function print(msg) {\n" + " console.log(msg);\n" + "}\n" + "\n" + "print('Hello, World!');"); ``` If you want to remove the theme's background graphics, use `setPlain`. ```java codeBlock.setPlain(true); ``` ## License This code is under the [BSD 3-Clause](LICENSE.txt). ## Sponsoring If you like my work and want to support it, please consider [sponsoring](https://github.com/sponsors/oliveryasuna) me. It's how I make the time to code great things! ## Note If you're already using [prism-element](https://vaadin.com/directory/component/prism-element) by Johannes Goebel, there's probably no reason to switch. The main difference is that I implemented a custom [web component](https://www.npmjs.com/package/@oliveryasuna/code-block) with Lit that uses Prism directly while Johannes used Polymer's [prism-element](https://www.npmjs.com/package/@polymer/prism-element). Also, I handle language and theme importing differently.