From 86535e150f4c3ccef9f03d601d58a466b4ad8478 Mon Sep 17 00:00:00 2001 From: Jonathan Kelley Date: Fri, 4 Feb 2022 17:57:00 -0500 Subject: [PATCH 1/4] fix: cargo fmt and readme update --- README.md | 36 ++++++++++++++++-------------------- examples/components.rs | 4 ++-- examples/keys.rs | 3 --- examples/layouts.rs | 5 ++--- src/attributes.rs | 41 ++++++++++++++++++++--------------------- src/hooks.rs | 24 ++++++------------------ src/lib.rs | 26 ++++++++++---------------- src/render.rs | 20 ++------------------ 8 files changed, 58 insertions(+), 101 deletions(-) diff --git a/README.md b/README.md index 592df5009..5f17c7b79 100644 --- a/README.md +++ b/README.md @@ -1,30 +1,13 @@ # Rink: Like "Ink" but for Rust and Dioxus -The fastest portable TUIs in the west - 🔫🤠🔫 - 🐎🔥🔥🔥 +Rink lets you build terminal user interfaces in Rust with [`Dioxus`](https://dioxuslabs.com/). -Rink lets you build terminal user interfaces in Rust with [`Dioxus`](https://dioxuslabs.com/). -You can use Html-like semantics with stylesheets, inline styles, tree hierarchy, components, and more in your [`text-based user interface (TUI)`](https://en.wikipedia.org/wiki/Text-based_user_interface) application. - -Rink is basically a port of [Ink](https://github.com/vadimdemedes/ink) but for [`Rust`](https://www.rust-lang.org/) and [`Dioxus`](https://dioxuslabs.com/). Rink doesn't depend on Node.js or any other JavaScript runtime, so your binaries are portable and beautiful. - -## Limitations - -- **Subset of Html** -Terminals can only render a subset of HTML. We support as much as we can. -- **Particular frontend design** -Terminals and browsers are and look different. Therefore, the same design might not be the best to cover both renderers. - -## Example - -Let's print `Hello world!` in the center of the screen. ```rust static App: FC<()> = |cx| { cx.render(rsx!{ - div { - width: "100%", + div { + width: "100%", height: "10px", background_color: "red", justify_content: "center", @@ -38,6 +21,19 @@ static App: FC<()> = |cx| { ![demo app](examples/example.png) +## Background + +You can use Html-like semantics with stylesheets, inline styles, tree hierarchy, components, and more in your [`text-based user interface (TUI)`](https://en.wikipedia.org/wiki/Text-based_user_interface) application. + +Rink is basically a port of [Ink](https://github.com/vadimdemedes/ink) but for [`Rust`](https://www.rust-lang.org/) and [`Dioxus`](https://dioxuslabs.com/). Rink doesn't depend on Node.js or any other JavaScript runtime, so your binaries are portable and beautiful. + +## Limitations + +- **Subset of Html** +Terminals can only render a subset of HTML. We support as much as we can. +- **Particular frontend design** +Terminals and browsers are and look different. Therefore, the same design might not be the best to cover both renderers. + ## Status diff --git a/examples/components.rs b/examples/components.rs index 1c12b4c33..4086a5855 100644 --- a/examples/components.rs +++ b/examples/components.rs @@ -7,10 +7,10 @@ fn main() { #[derive(Props, PartialEq)] struct QuadrentProps { color: String, - text: String + text: String, } -fn Quadrent(cx: Scope) -> Element{ +fn Quadrent(cx: Scope) -> Element { cx.render(rsx! { div { border_width: "1px", diff --git a/examples/keys.rs b/examples/keys.rs index ef9df9750..77bf7683d 100644 --- a/examples/keys.rs +++ b/examples/keys.rs @@ -1,8 +1,5 @@ -use std::cell::RefCell; - use crossterm::event::{KeyCode, KeyEvent, MouseEvent}; use dioxus::prelude::*; -use rink::InputHandler; fn main() { rink::launch(app); diff --git a/examples/layouts.rs b/examples/layouts.rs index e4278c2b1..c6d661e5b 100644 --- a/examples/layouts.rs +++ b/examples/layouts.rs @@ -1,7 +1,6 @@ use std::collections::HashMap; -use dioxus::{core::ElementId, prelude::*}; -use rink::TuiNode; +use dioxus::prelude::*; fn main() { let mut dom = VirtualDom::new(app); @@ -19,7 +18,7 @@ fn main() { .compute_layout(node.layout, stretch2::geometry::Size::undefined()) .unwrap(); - for (id, node) in nodes.drain() { + for (_id, node) in nodes.drain() { println!("{:?}", layout.layout(node.layout)); } } diff --git a/src/attributes.rs b/src/attributes.rs index 1f8013575..d84779406 100644 --- a/src/attributes.rs +++ b/src/attributes.rs @@ -343,7 +343,7 @@ fn apply_overflow(name: &str, value: &str, style: &mut StyleModifer) { } } -fn apply_display(name: &str, value: &str, style: &mut StyleModifer) { +fn apply_display(_name: &str, value: &str, style: &mut StyleModifer) { use stretch2::style::Display; style.style.display = match value { "flex" => Display::Flex, @@ -387,29 +387,28 @@ fn apply_background(name: &str, value: &str, style: &mut StyleModifer) { "white" => style.tui_style.bg.replace(Color::White), "black" => style.tui_style.bg.replace(Color::Black), _ => { - if value.len() == 7{ + if value.len() == 7 { let mut values = [0, 0, 0]; let mut color_ok = true; - for i in 0..values.len(){ - if let Ok(v) = u8::from_str_radix(&value[(1+2*i)..(1+2*(i+1))], 16){ + for i in 0..values.len() { + if let Ok(v) = + u8::from_str_radix(&value[(1 + 2 * i)..(1 + 2 * (i + 1))], 16) + { values[i] = v; - } - else{ + } else { color_ok = false; } } - if color_ok{ + if color_ok { let color = Color::Rgb(values[0], values[1], values[2]); style.tui_style.bg.replace(color) - } - else{ + } else { None } - } - else{ + } else { None } - }, + } }; } "background" => {} @@ -424,7 +423,7 @@ fn apply_background(name: &str, value: &str, style: &mut StyleModifer) { } } -fn apply_border(name: &str, value: &str, style: &mut StyleModifer) { +fn apply_border(name: &str, value: &str, _style: &mut StyleModifer) { match name { "border" => {} "border-bottom" => {} @@ -459,7 +458,7 @@ fn apply_border(name: &str, value: &str, style: &mut StyleModifer) { "border-top-style" => {} "border-top-width" => {} "border-width" => { - if let Ok(px) = value.trim_end_matches("px").parse::() { + if let Ok(_px) = value.trim_end_matches("px").parse::() { // tuistyle = px; } } @@ -467,7 +466,7 @@ fn apply_border(name: &str, value: &str, style: &mut StyleModifer) { } } -fn apply_animation(name: &str, value: &str, style: &mut StyleModifer) { +fn apply_animation(name: &str, _value: &str, _style: &mut StyleModifer) { match name { "animation" => {} "animation-delay" => {} @@ -482,7 +481,7 @@ fn apply_animation(name: &str, value: &str, style: &mut StyleModifer) { } } -fn apply_column(name: &str, value: &str, style: &mut StyleModifer) { +fn apply_column(name: &str, _value: &str, _style: &mut StyleModifer) { match name { "column-count" => {} "column-fill" => {} @@ -551,7 +550,7 @@ fn apply_flex(name: &str, value: &str, style: &mut StyleModifer) { } } -fn apply_font(name: &str, value: &str, style: &mut StyleModifer) { +fn apply_font(_name: &str, _value: &str, _style: &mut StyleModifer) { todo!() } @@ -588,15 +587,15 @@ fn apply_padding(name: &str, value: &str, style: &mut StyleModifer) { } } -fn apply_text(name: &str, value: &str, style: &mut StyleModifer) { +fn apply_text(_name: &str, _value: &str, _style: &mut StyleModifer) { todo!() } -fn apply_transform(name: &str, value: &str, style: &mut StyleModifer) { +fn apply_transform(_name: &str, _value: &str, _style: &mut StyleModifer) { todo!() } -fn apply_transition(name: &str, value: &str, style: &mut StyleModifer) { +fn apply_transition(_name: &str, _value: &str, _style: &mut StyleModifer) { todo!() } @@ -640,7 +639,7 @@ fn apply_align(name: &str, value: &str, style: &mut StyleModifer) { } } -pub fn apply_size(name: &str, value: &str, style: &mut StyleModifer) { +pub fn apply_size(_name: &str, _value: &str, _style: &mut StyleModifer) { // } diff --git a/src/hooks.rs b/src/hooks.rs index 9ec8d47a6..b34068c19 100644 --- a/src/hooks.rs +++ b/src/hooks.rs @@ -1,24 +1,12 @@ -use anyhow::Result; -use crossterm::{ - event::{ - DisableMouseCapture, EnableMouseCapture, Event as TermEvent, KeyCode, KeyEvent, MouseEvent, - }, - execute, - terminal::{disable_raw_mode, enable_raw_mode, EnterAlternateScreen, LeaveAlternateScreen}, -}; -use dioxus::{core::exports::futures_channel::mpsc::unbounded, prelude::Props}; -use dioxus::{core::*, prelude::*}; -use futures::{channel::mpsc::UnboundedReceiver, future::Either, pin_mut, StreamExt}; +use crossterm::event::{Event as TermEvent, KeyEvent, MouseEvent}; +use dioxus::core::*; +use dioxus::prelude::Props; +use futures::{channel::mpsc::UnboundedReceiver, StreamExt}; use std::{ cell::{Cell, RefCell}, collections::HashMap, - io, rc::Rc, - time::{Duration, Instant}, }; -use stretch2::{prelude::Size, Stretch}; -use tokio::sync::broadcast::Receiver; -use tui::{backend::CrosstermBackend, style::Style as TuiStyle, Terminal}; pub struct RinkContext { last_event: Rc>>, @@ -44,8 +32,8 @@ impl RinkContext { }); Self { - last_event: last_event, - subscribers: subscribers, + last_event, + subscribers, } } diff --git a/src/lib.rs b/src/lib.rs index 89206b934..0e56089bb 100644 --- a/src/lib.rs +++ b/src/lib.rs @@ -1,21 +1,15 @@ use anyhow::Result; use crossterm::{ - event::{DisableMouseCapture, EnableMouseCapture, Event as TermEvent, KeyCode, KeyEvent}, + event::{DisableMouseCapture, EnableMouseCapture, Event as TermEvent, KeyCode, KeyModifiers}, execute, terminal::{disable_raw_mode, enable_raw_mode, EnterAlternateScreen, LeaveAlternateScreen}, }; -use dioxus::{core::exports::futures_channel::mpsc::unbounded, prelude::Props}; -use dioxus::{core::*, prelude::*}; -use futures::{ - channel::mpsc::{UnboundedReceiver, UnboundedSender}, - future::Either, - pin_mut, StreamExt, -}; +use dioxus::core::exports::futures_channel::mpsc::unbounded; +use dioxus::core::*; +use futures::{channel::mpsc::UnboundedSender, pin_mut, StreamExt}; use std::{ - cell::Cell, collections::HashMap, io, - rc::Rc, time::{Duration, Instant}, }; use stretch2::{prelude::Size, Stretch}; @@ -136,17 +130,17 @@ pub fn render_vdom(vdom: &mut VirtualDom, ctx: UnboundedSender) -> Re pin_mut!(wait); match select(wait, rx.next()).await { - Either::Left((a, b)) => { + Either::Left((_a, _b)) => { // } - Either::Right((evt, o)) => { - // + Either::Right((evt, _o)) => { match evt.as_ref().unwrap() { InputEvent::UserInput(event) => match event { TermEvent::Key(key) => { - match key.code { - KeyCode::Char('q') => break, - _ => {} // handle event + if matches!(key.code, KeyCode::Char('c')) + && key.modifiers.contains(KeyModifiers::CONTROL) + { + break; } } TermEvent::Resize(_, _) | TermEvent::Mouse(_) => {} diff --git a/src/render.rs b/src/render.rs index 21cc6e01f..46e590f17 100644 --- a/src/render.rs +++ b/src/render.rs @@ -1,22 +1,8 @@ -use anyhow::Result; -use crossterm::{ - event, - event::{DisableMouseCapture, EnableMouseCapture, Event as TermEvent, KeyCode, KeyEvent}, - execute, - terminal::{disable_raw_mode, enable_raw_mode, EnterAlternateScreen, LeaveAlternateScreen}, -}; use dioxus::core::*; -use std::{ - collections::HashMap, - io::{self, Stdout}, - sync::mpsc, - thread, - time::{Duration, Instant}, -}; +use std::{collections::HashMap, io::Stdout}; use stretch2::{ geometry::Point, prelude::{Layout, Size}, - style::Style as StretchStyle, Stretch, }; use tui::{ @@ -24,9 +10,7 @@ use tui::{ buffer::Buffer, layout::Rect, style::Style as TuiStyle, - text::Span, - widgets::{canvas::Label, Block, BorderType, Borders, Widget}, - Terminal, + widgets::{Block, Widget}, }; use crate::TuiNode; From 828fa2f0630597bb99494175cdcac23f3c98a542 Mon Sep 17 00:00:00 2001 From: Jonathan Kelley Date: Fri, 4 Feb 2022 18:01:53 -0500 Subject: [PATCH 2/4] docs: update readme --- README.md | 43 +++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 41 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 5f17c7b79..3c29107d4 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,46 @@ -# Rink: Like "Ink" but for Rust and Dioxus +
+

Rink

+

+ Beautiful terminal user interfaces in Rust with [`Dioxus`](https://dioxuslabs.com/). +

+
-Rink lets you build terminal user interfaces in Rust with [`Dioxus`](https://dioxuslabs.com/). +
+ + + Crates.io version + + + + Download + + + + docs.rs docs + + + + CI status + + + + Awesome Page + + + + Discord Link + +
+ + +
+ +Leverage React-like patterns to build beautiful, portable, terminal user interfaces with Dioxus and Rust. ```rust static App: FC<()> = |cx| { From 90d8995645b63cb407e8ac299bf4cd704eb487d4 Mon Sep 17 00:00:00 2001 From: Jonathan Kelley Date: Fri, 4 Feb 2022 18:02:34 -0500 Subject: [PATCH 3/4] fix: readme link --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 3c29107d4..92a8cc4cb 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,7 @@

Rink

- Beautiful terminal user interfaces in Rust with [`Dioxus`](https://dioxuslabs.com/). + Beautiful terminal user interfaces in Rust with Dioxus .

From 198d883547c5b2750d2ea7671da7eba5fb29c0d9 Mon Sep 17 00:00:00 2001 From: Jonathan Kelley Date: Fri, 4 Feb 2022 18:05:03 -0500 Subject: [PATCH 4/4] docs: update readme --- README.md | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 92a8cc4cb..20adaeb6c 100644 --- a/README.md +++ b/README.md @@ -40,10 +40,10 @@
-Leverage React-like patterns to build beautiful, portable, terminal user interfaces with Dioxus and Rust. +Leverage React-like patterns, CSS, HTML, and Rust to build beautiful, portable, terminal user interfaces with Dioxus. ```rust -static App: FC<()> = |cx| { +fn app(cx: Scope) -> Element { cx.render(rsx!{ div { width: "100%", @@ -51,7 +51,6 @@ static App: FC<()> = |cx| { background_color: "red", justify_content: "center", align_items: "center", - "Hello world!" } })