diff --git a/README.md b/README.md
index 681033d..196ba21 100644
--- a/README.md
+++ b/README.md
@@ -1,5 +1,8 @@
+
[](https://insality.github.io/druid/)
+[](https://github.com/sponsors/insality) [](https://ko-fi.com/insality) [](https://www.buymeacoffee.com/insality)
+
[](https://github.com/Insality/druid/releases)
[](https://github.com/Insality/druid/actions)
[](https://codecov.io/gh/Insality/druid)
@@ -115,51 +118,36 @@ druid.on_window_callback(event)
## Components
-**Druid** provides the following *basic* components:
+Here is full **Druid** components list:
-- **[Button](docs_md/01-components.md#button)** - Basic Druid button input component. Handles all types of interactions (tap, long-tap, hold-tap, double-tap, simple key triggers, etc)
+| Name | Description | API page | Example Link | Is Basic component[^1] | Preview |
+|------|-------------|----------|------------|-------------|---------|
+| **[Button](docs_md/01-components.md#button)** | Basic input component. Handles all types of interactions: click, long click, hold click, double click, etc | [Button API](https://insality.github.io/druid/modules/Button.html) | [Button Example](https://insality.github.io/druid/druid/?example=general_buttons) | ✅ |
|
+| **[Text](docs_md/01-components.md#text)** | Wrap on GUI text node, handle different text size adjusting, providing additional text API | [Text API](https://insality.github.io/druid/modules/Button.html) | [Text Example](https://insality.github.io/druid/druid/?example=texts_general) | ✅ |
|
+| **[Scroll](docs_md/01-components.md#scroll)** | Scroll component | [Scroll API](https://insality.github.io/druid/modules/Scroll.html) | [Scroll Example](https://insality.github.io/druid/druid/?example=general_scroll) | ✅ |
|
+| **[Blocker](docs_md/01-components.md#blocker)** | Block user input in node zone area | [Blocker API](https://insality.github.io/druid/modules/Blocker.html) | ❌ | ✅ | |
+| **[Back Handler](docs_md/01-components.md#back-handler)** | Handle back button (Android back button, backspace key) | [Back Handler API](https://insality.github.io/druid/modules/BackHandler.html) | ❌ | ✅ | |
+| **[Static Grid](docs_md/01-components.md#static-grid)** | Component to manage node positions with equal sizes | [Static Grid API](https://insality.github.io/druid/modules/StaticGrid.html) | [Static Gid Example](https://insality.github.io/druid/druid/?example=general_grid) | ✅ |
|
+| **[Hover](docs_md/01-components.md#hover)** | Handle hover node state on node | [Hover API](https://insality.github.io/druid/modules/Hover.html) | ❌ | ✅ |
|
+| **[Swipe](docs_md/01-components.md#swipe)** | Handle swipe gestures on node | [Swipe API](https://insality.github.io/druid/modules/Swipe.html) | [Swipe Example](https://insality.github.io/druid/druid/?example=general_swipe) | ✅ |
|
+| **[Drag](docs_md/01-components.md#drag)** | Handle drag input on node | [Drag API](https://insality.github.io/druid/modules/Drag.html) | [Drag Example](https://insality.github.io/druid/druid/?example=general_drag) | ✅ |
|
+| **[Checkbox](docs_md/01-components.md#checkbox)** | Checkbox component | [Checkbox API](https://insality.github.io/druid/modules/Checkbox.html) | [Checkbox Example](https://insality.github.io/druid/druid/?example=general_checkboxes) | ❌ |
|
+| **[Checkbox group](docs_md/01-components.md#checkbox-group)** | Several checkboxes in one group | [Checkbox group API](https://insality.github.io/druid/modules/CheckboxGroup.html) | [Checkbox group Example](https://insality.github.io/druid/druid/?example=general_checkboxes) | ❌ |
|
+| **[Radio group](docs_md/01-components.md#radio-group)** | Several checkboxes in one group with a single choice | [Radio group API](https://insality.github.io/druid/modules/RadioGroup.html) | [Radio Group Example](https://insality.github.io/druid/druid/?example=general_checkboxes) | ❌ |
|
+| **[Dynamic Grid](docs_md/01-components.md#dynamic-grid)** | Component to manage node positions with different sizes. Only in one row or column | [Dynamic Grid API](https://insality.github.io/druid/modules/DynamicGrid.html) | [Dynamic Grid Example](https://insality.github.io/druid/druid/?example=general_grid) | ❌ |
|
+| **[Data List](docs_md/01-components.md#data-list)** | Component to manage data for huge datasets in scroll | [Data List API](https://insality.github.io/druid/modules/DataList.html) | [Data List Example](https://insality.github.io/druid/druid/?example=general_data_list) | ❌ |
|
+| **[Input](docs_md/01-components.md#input)** | User text input component | [Input API](https://insality.github.io/druid/modules/Input.html) | [Input Example](https://insality.github.io/druid/druid/?example=general_input) | ❌ |
|
+| **[Lang text](docs_md/01-components.md#lang-text)** | Wrap on Text component to handle localization | [Lang Text API](https://insality.github.io/druid/modules/LangText.html) | ❌ | ❌ |
|
+| **[Progress](docs_md/01-components.md#progress)** | Progress bar component | [Progress API](https://insality.github.io/druid/modules/Progress.html) | [Progress Example](https://insality.github.io/druid/druid/?example=general_progress_bar) | ❌ |
|
+| **[Slider](docs_md/01-components.md#slider)** | Slider component | [Slider API](https://insality.github.io/druid/modules/Slider.html) | [Slider Example](https://insality.github.io/druid/druid/?example=general_sliders) | ❌ |
|
+| **[Timer](docs_md/01-components.md#timer)** | Handle timers on GUI text node | [Timer API](https://insality.github.io/druid/modules/Timer.html) | ❌ | ❌ |
|
+| **[Hotkey](docs_md/01-components.md#hotkey)** | Handle keyboard hotkeys with key modificators | [Hotkey API](https://insality.github.io/druid/modules/Hotkey.html) | [Hotkey Example](https://insality.github.io/druid/druid/?example=general_hokey) | ❌ |
|
+| **[Layout](docs_md/01-components.md#layout)** | Handle node size depends on layout mode and screen aspect ratio | [Layout API](https://insality.github.io/druid/modules/Layout.html) | [Layout Example](https://insality.github.io/druid/druid/?example=general_layout) | ❌ |
|
-- **[Text](docs_md/01-components.md#text)** - Basic Druid text component. Wrap on gui text node, handle text size adjusting.
+For a complete overview, see: **_[components.md](docs_md/01-components.md)_**.
-- **[Scroll](docs_md/01-components.md#scroll)** - Basic Druid scroll component
+[^1]: Non basic components before use should be registered first to be included in build
-- **[Blocker](docs_md/01-components.md#blocker)** - Block input in node zone component
-
-- **[Back Handler](docs_md/01-components.md#back-handler)** - Handle back button (Android back button, backspace key)
-
-- **[Static Grid](docs_md/01-components.md#static-grid)** - Component to manage node positions with equal sizes
-
-- **[Hover](docs_md/01-components.md#hover)** - System Druid component, handle hover node state
-
-- **[Swipe](docs_md/01-components.md#swipe)** - System Druid component, handle swipe gestures on node
-
-- **[Drag](docs_md/01-components.md#drag)** - System Druid component, handle drag input on node
-
-**Druid** also provides the following *extended* components:
-
-***Note**: In the future, to use extended components, you should register them first. This is required to make **Druid** modular - to exclude unused components from builds*
-
-- **[Checkbox](docs_md/01-components.md#checkbox)** - Checkbox component
-
-- **[Checkbox group](docs_md/01-components.md#checkbox-group)** - Several checkboxes in one group
-
-- **[Dynamic Grid](docs_md/01-components.md#dynamic-grid)** - Component to manage node positions with different sizes. Only in one row or column
-
-- **[Data List](docs_md/01-components.md#data-list)** - Component to manage data for huge dataset in scroll
-
-- **[Input](docs_md/01-components.md#input)** - User text input component
-
-- **[Lang text](docs_md/01-components.md#lang-text)** - Wrap on Text component to handle localization
-
-- **[Progress](docs_md/01-components.md#progress)** - Progress bar component
-
-- **[Radio group](docs_md/01-components.md#radio-group)** - Several checkboxes in one group with a single choice
-
-- **[Slider](docs_md/01-components.md#slider)** - Slider component
-
-- **[Timer](docs_md/01-components.md#timer)** - Handle timer work on gui text node
-
-For a complete overview, see: _[components.md](docs_md/01-components.md)_.
## Basic usage
@@ -285,3 +273,10 @@ https://insality.github.io/druid/
## Issues and suggestions
If you have any issues, questions or suggestions please [create an issue](https://github.com/Insality/druid/issues) or contact me: [insality@gmail.com](mailto:insality@gmail.com)
+
+
+## ❤️ Support project ❤️
+
+Please support me if you like this project! It will help me keep engaged to update **Druid** and make it even better!
+
+[](https://github.com/sponsors/insality) [](https://ko-fi.com/insality) [](https://www.buymeacoffee.com/insality)
diff --git a/media/preview/button.gif b/media/preview/button.gif
new file mode 100644
index 0000000..c60d278
Binary files /dev/null and b/media/preview/button.gif differ
diff --git a/media/preview/checkbox.gif b/media/preview/checkbox.gif
new file mode 100644
index 0000000..461b065
Binary files /dev/null and b/media/preview/checkbox.gif differ
diff --git a/media/preview/checkbox_group.gif b/media/preview/checkbox_group.gif
new file mode 100644
index 0000000..65cf80f
Binary files /dev/null and b/media/preview/checkbox_group.gif differ
diff --git a/media/preview/data_list.gif b/media/preview/data_list.gif
new file mode 100644
index 0000000..d8d70f9
Binary files /dev/null and b/media/preview/data_list.gif differ
diff --git a/media/preview/drag.gif b/media/preview/drag.gif
new file mode 100644
index 0000000..320f443
Binary files /dev/null and b/media/preview/drag.gif differ
diff --git a/media/preview/dynamic_grid.gif b/media/preview/dynamic_grid.gif
new file mode 100644
index 0000000..ce114d8
Binary files /dev/null and b/media/preview/dynamic_grid.gif differ
diff --git a/media/preview/hotkey.gif b/media/preview/hotkey.gif
new file mode 100644
index 0000000..5acf1c8
Binary files /dev/null and b/media/preview/hotkey.gif differ
diff --git a/media/preview/hover.gif b/media/preview/hover.gif
new file mode 100644
index 0000000..7497feb
Binary files /dev/null and b/media/preview/hover.gif differ
diff --git a/media/preview/input.gif b/media/preview/input.gif
new file mode 100644
index 0000000..e9d1187
Binary files /dev/null and b/media/preview/input.gif differ
diff --git a/media/preview/lang_text.gif b/media/preview/lang_text.gif
new file mode 100644
index 0000000..97f8f42
Binary files /dev/null and b/media/preview/lang_text.gif differ
diff --git a/media/preview/layout.gif b/media/preview/layout.gif
new file mode 100644
index 0000000..b90ac3a
Binary files /dev/null and b/media/preview/layout.gif differ
diff --git a/media/preview/progress.gif b/media/preview/progress.gif
new file mode 100644
index 0000000..95ad35d
Binary files /dev/null and b/media/preview/progress.gif differ
diff --git a/media/preview/radio_group.gif b/media/preview/radio_group.gif
new file mode 100644
index 0000000..d3185cc
Binary files /dev/null and b/media/preview/radio_group.gif differ
diff --git a/media/preview/scroll.gif b/media/preview/scroll.gif
new file mode 100644
index 0000000..e8e3373
Binary files /dev/null and b/media/preview/scroll.gif differ
diff --git a/media/preview/slider.gif b/media/preview/slider.gif
new file mode 100644
index 0000000..eacc906
Binary files /dev/null and b/media/preview/slider.gif differ
diff --git a/media/preview/static_grid.gif b/media/preview/static_grid.gif
new file mode 100644
index 0000000..a9112e8
Binary files /dev/null and b/media/preview/static_grid.gif differ
diff --git a/media/preview/swipe.gif b/media/preview/swipe.gif
new file mode 100644
index 0000000..870e26c
Binary files /dev/null and b/media/preview/swipe.gif differ
diff --git a/media/preview/text.gif b/media/preview/text.gif
new file mode 100644
index 0000000..719a82f
Binary files /dev/null and b/media/preview/text.gif differ
diff --git a/media/preview/timer.gif b/media/preview/timer.gif
new file mode 100644
index 0000000..c3a0bb5
Binary files /dev/null and b/media/preview/timer.gif differ