feat: added css property

Author: =

build/index.js

@@ -2,10 +2,24 @@ App {
     uses: [
         "./other.ln"
     ],
+    css: {
+        display: "flex"
+        justify-content: "center"
+        flex-direction: "column"
+    },
     class: "this is my custom class",
     id: "this is my custom id",
 
-    h1 { "can we parse the component above?" }
+
+    h1 {
+        css: {
+        text-align: "center"
+        background: "grey"
+        color: "green"
+        }
+
+        "can we parse the component above?"
+    }
     Other {}
     Other {}
 

example/main.ln

@@ -1,6 +1,11 @@
 Other {
     uses: ["./hello.ln"],
     class: "pretty_component",
+    css: {
+        width: "100%"
+        height: "100%"
+        background: "blue"
+    }
 
 
     h1 { "this is another component that i am using" }

example/other.ln

@@ -35,7 +35,7 @@ pub struct Component {
     pub tag: String,
     pub children: Vec<Component>,
     pub value: String,
-    // pub info: HashMap<String, Value>, // store css and attributes refactor later
+    pub info: HashMap<String, Value>, // store css and attributes refactor later
 }
 
 #[derive(Debug, Clone)]
@@ -78,6 +78,12 @@ impl El {
         let _ = self.append_child(&e);
         self
     }
+
+    // this implementation is subjct to change
+    pub fn css(self, css: &str) -> Self {
+        let _ = self.set_attribute("style", css);
+        self
+    }
 }
 
 fn tagify(tag: &str) -> &str {
@@ -97,6 +103,15 @@ fn create_dom_from_ir(root: Component) -> El {
             e = e.clone().child(create_dom_from_ir(c));
         });
     }
+
+    if root.info.contains_key("css") {
+        let styles = match root.info.get("css").unwrap() {
+            Value::STRING(x) => x,
+            _ => "",
+        };
+
+        e = e.css(styles);
+    }
     e
 }
 

magic/src/lib.rs

@@ -63,7 +63,7 @@ impl Lexer {
     fn read_identifier(&mut self) -> String {
         let position = self.position; // starting point
                                       // read the full identifier
-        while self.ch.is_alphanumeric() {
+        while self.ch.is_alphanumeric() || self.ch == '-' || self.ch == '_' {
             self.read_char()
         }
         self.input[position..self.position].to_string()

src/lexer.rs

@@ -5,7 +5,6 @@ use crate::{
     lexer::Lexer,
     token::{Token, TokenType},
 };
-use serde;
 
 #[derive(Debug, Default)]
 pub struct Parser {
@@ -152,10 +151,16 @@ impl Parser {
     fn parse_component_info(&mut self) -> HashMap<String, Value> {
         let mut vec_of_info = HashMap::<String, Value>::new();
         while self.peek_token_is(TokenType::COLON) {
+            println!("{:?}", self.current_token);
             let key = self.current_token.literal.clone();
+
             self.next_token(); // move to the colon
             self.next_token(); // move to the starting of the value for the key
-
+            if key == "css" {
+                let v = self.parse_css();
+                vec_of_info.insert(key, v);
+                continue;
+            }
             // for now it can be a string or an list of strings
             let value: Value = match self.current_token.tokentype {
                 TokenType::STRING => {
@@ -183,6 +188,35 @@ impl Parser {
         vec_of_info
     }
 
+    // TODO: Change this implementation later
+    fn parse_css(&mut self) -> Value {
+        if self.cur_token_is(TokenType::LBRACE) {
+            self.next_token();
+        }
+        let mut vec_of_css = Vec::<String>::new();
+        while self.peek_token_is(TokenType::COLON) {
+            let key = self.current_token.literal.clone();
+            self.next_token(); // move to colon
+            self.next_token(); // move to the value
+            println!("css::::{} {:?}", key, self.current_token);
+            if !self.cur_token_is(TokenType::STRING) {
+                self.errors
+                    .push("parse_css: CSS values must be a string".to_string());
+            }
+            let v = self.current_token.literal.clone();
+            self.next_token();
+
+            vec_of_css.push(format!("{}: {}", key, v));
+        }
+        if self.cur_token_is(TokenType::RBRACE) {
+            self.next_token();
+        }
+        if self.cur_token_is(TokenType::COMMA) {
+            self.next_token();
+        }
+        Value::STRING(vec_of_css.join(";"))
+    }
+
     fn parse_vec_of_token(&mut self, tk: TokenType) -> Value {
         let mut vec_of_tk = Vec::<Value>::new();
         while !self.cur_token_is(TokenType::RSQBRACE) {