1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74
//! Yew Prism is a highlighter code component based in [Prism](https://prismjs.com) for [yew](https://yew.rs) //! //! ## How it works //! //! 1. Install the `prismjs` node module //! //! `npm install prismjs` //! //! 2. Import the prismjs module and styles, and all the languages component which you want to use for highlighting, //! in your javascript/typescript main file yew project //! //! ```typescript //! import 'prismjs/themes/prism.css'; //! import 'prismjs'; //! import 'prismjs/components/prism-markup'; //! import 'prismjs/components/prism-rust'; //! import module from '../crate/Cargo.toml'; //! //! module.run(); //! ``` //! //! **Note:** You can use [yew-parcel-template](https://github.com/spielrs/yew-parcel-template) or another template described //! [here](https://yew.rs/docs/getting-started/starter-templates) to create a yew project //! //! 3. Add yew_prism in your cargo.toml //! //! ```toml //! [dependencies] //! yew = { version = "0.17", features = ["toml", "yaml", "msgpack", "cbor", "web_sys"]} //! yew_prism = "0.4" //! ``` //! //! **Note:** Currently yew_prism only support web_sys feature. Maybe [stdweb](https://github.com/koute/stdweb) feature is included //! in the future depending if the library continues to be supported. //! //! 4. Now you are ready to use the component 🚀 //! //! ## Example //! //! ```rust //! use yew::prelude::*; //! use yew_prism::Prism; //! //! pub struct App; //! impl Component for App { //! type Message = (); //! type Properties = (); //! //! fn create(_: Self::Properties, _: ComponentLink<Self>) -> Self { //! App {} //! } //! //! fn update(&mut self, _: Self::Message) -> ShouldRender { //! false //! } //! //! fn change(&mut self, _props: Self::Properties) -> ShouldRender { //! false //! } //! //! fn view(&self) -> Html { //! html! { //! <Prism //! code="let greeting: &str = \"Hello World\";" //! language="rust" //! /> //! } //! } //! } //! ``` pub mod prism; pub mod prism_sys; pub use prism::{Prism, Props};