upcoming v0.0.8

docs/references/a_rsx.md

@@ -70,17 +70,6 @@ fn app() -> Element {
 }
 ```
 
-## Type assignment
-In special elements like `data_holder` You can specify what `type` the element holds. It would act like `my_fn::<Type>()`
-```rust
-fn app() -> Element {
-    rsx! {
-        // assign the type u32
-        data_holder as u32 { id: "count" }
-    }
-}
-```
-
 ## Handler functions
 Instead of closures which are tricky to work with on structs, We use `Handler`, It's basically a closure wrapped with a `Arc<Mutex<T>>`
 ```rust
@@ -95,13 +84,20 @@ fn app() -> Element {
 }
 ```
 
-## Variables
+## Handler functions (with dependents)
-Instead of creating a `data_holder as u32` manually you can just define a variable with `@name: type;`
+If you have a `State<T>` and want to use it, you have to put a @ before the code block like this
-> :::info Put this on the end of the rsx to avoid any conflicts with existing elements
 ```rust
 fn app() -> Element {
+    let count = State::new();
+
     rsx! {
-        @count: u32;
+        button {
+            on_click: fn(btn: &mut Button, event, document) @count {
+                let count = count.use_state(); // locks count so it can be used
+            },
+            "Current count: {count}"
+        }
     }
 }
-```
+```
+> :::info you can add multiple decedents by separating them via `,` like: @var1, var2, var3

docs/references/b_handler.md

@@ -10,7 +10,7 @@ Handler::new(|btn: &mut Button, event, document| {
     // do something
 })
 ```
-A better way to do this is:
+### Recommended way
 ```rust
 rsx! {
     button {
@@ -21,4 +21,22 @@ rsx! {
     }
 }
 ```
-> :::info `fn() {}` is a part of our macro `rsx!`. In rust you would normally use `|| {}`
+### With dependents
+If you have a `State<T>` and want to use it, you have to put a @ before the code block like this
+```rust
+fn app() -> Element {
+    let count = State::new();
+
+    rsx! {
+        button {
+            on_click: fn(btn: &mut Button, event, document) @count {
+                let count = count.use_state(); // locks count so it can be used
+            },
+            "Current count: {count}"
+        }
+    }
+}
+```
+> :::info you can add multiple decedents by separating them via `,` like: @var1, var2, var3
+
+> :::info `fn() {}` is a part of the OSUI macro `rsx!`. In rust you would normally use `|| {}`

docs/references/css.md

@@ -26,7 +26,7 @@ fn styles() -> Css {
 
         // Style by state
 
-        "my_btn": clicked { // When the element state is clicked
+        "my_btn": "clicked" { // When the element state is clicked
             color: Blue,
         }
     }

docs/references/e_document.md

@@ -22,9 +22,7 @@ Restarts the program
 Retrieves a mutable reference to a boxed element of type T by its string identifier, returning None if no such element exists.
 > :::info Please make sure that the type of the element is correctly matched to the element of that id
 ### `get_element_by_id_raw(id: &str) -> Option<&mut Element>`
-> :::warn Not recommended to use this function, Use `get_element_by_id` instead
+> :::warning Not recommended to use this function, Use `get_element_by_id` instead
 Retrieves a mutable reference to a boxed element by its string identifier, returning None if no such element exists
 ### `render()`
-Renders/reloads the screen, useful when a element updates
+Renders/reloads the screen, useful when a element updates
-### `use_state<T>(name: &str) -> &mut T`
-Gets element (DataHolder) by id and returns the data of it: `&mut T`

docs/references/f_element.md

@@ -2,4 +2,47 @@
 title: Element
 ---
 
-`Element` is a type alias of `Box<dyn ElementWidget>`. It makes the code look cleaner
+`Element` is a type alias of `Box<dyn ElementWidget>`. It makes the code look cleaner
+
+# ElementWidget
+`ElementWidget` is a trait that defines the Elements and it's rendering / event updates.
+
+## Methods
+### `render(&self, focused: bool) -> Option<RenderResult>`
+- **required**
+- This function renders the element
+
+### `event(&mut self, event: Event, document: &Document)`
+- **optional**
+- This function updates the element when there is a event
+
+
+# ElementCore
+`ElementCore` is a trait that will automatically be implemented by the `osui_element::element` proc-macro. All of it's functions are used by OSUI.
+
+## `element` proc-macro
+This macro adds the essential fields and functions for a `ElementCore` structure.
+```rust
+use osui_element::element;
+#[element]
+#[derive(Default, Debug)]
+struct MyElement {}
+```
+
+## `elem_fn` proc-macro
+This macro makes a function that returns a `Box<T>` of which T is the default of `MyElement`
+```rust
+use osui_element::{element, elem_fn};
+#[element]
+#[elem_fn]
+#[derive(Default, Debug)]
+struct MyElement {}
+```
+
+>:::info
+>You can also define a function for the element manually:
+>```rust
+>pub fn my_element() -> Box<MyElement> {
+>    Box::new(MyElement::default())
+>}
+>```

docs/references/g_element_widget.md

@@ -1,14 +0,0 @@
----
-title: ElementWidget
----
-
-`ElementWidget` is a trait that defines the Elements and it's rendering / event updates.
-
-## Methods
-### `render(&self, focused: bool) -> Option<RenderResult>`
-- **required**
-- This function renders the element
-
-### `event(&mut self, event: Event, document: &Document)`
-- **optional**
-- This function updates the element when there is a event

docs/references/h_element_core.md

@@ -1,32 +0,0 @@
----
-title: ElementCore
----
-
-`ElementCore` is a trait that will automatically be implemented by the `osui_element::element` proc-macro. All of it's functions are used by OSUI.
-
-## `element` proc-macro
-This macro adds the essential fields and functions for a `ElementCore` structure.
-```rust
-use osui_element::element;
-#[element]
-#[derive(Default, Debug)]
-struct MyElement {}
-```
-
-## `elem_fn` proc-macro
-This macro makes a function that returns a `Box<T>` of which T is the default of `MyElement`
-```rust
-use osui_element::{element, elem_fn};
-#[element]
-#[elem_fn]
-#[derive(Default, Debug)]
-struct MyElement {}
-```
-
->:::info
->You can also define a function for the element manually:
->```rust
->pub fn my_element() -> Box<MyElement> {
->    Box::new(MyElement::default())
->}
->```

versioned_docs/version-0.0.7/references/e_document.md

@@ -22,7 +22,7 @@ Restarts the program
 Retrieves a mutable reference to a boxed element of type T by its string identifier, returning None if no such element exists.
 > :::info Please make sure that the type of the element is correctly matched to the element of that id
 ### `get_element_by_id_raw(id: &str) -> Option<&mut Element>`
-> :::warn Not recommended to use this function, Use `get_element_by_id` instead
+> :::warning Not recommended to use this function, Use `get_element_by_id` instead
 Retrieves a mutable reference to a boxed element by its string identifier, returning None if no such element exists
 ### `render()`
 Renders/reloads the screen, useful when a element updates