dars-framework 1.2.7__tar.gz → 1.2.9__tar.gz

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (124) hide show
  1. {dars_framework-1.2.7 → dars_framework-1.2.9}/PKG-INFO +41 -2
  2. dars_framework-1.2.7/dars_framework.egg-info/PKG-INFO → dars_framework-1.2.9/README.md +244 -222
  3. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/cli/main.py +867 -714
  4. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/config.py +1 -0
  5. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/security.py +21 -14
  6. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/version.py +2 -2
  7. dars_framework-1.2.7/README.md → dars_framework-1.2.9/dars_framework.egg-info/PKG-INFO +57 -1
  8. {dars_framework-1.2.7 → dars_framework-1.2.9}/pyproject.toml +1 -1
  9. {dars_framework-1.2.7 → dars_framework-1.2.9}/LICENSE +0 -0
  10. {dars_framework-1.2.7 → dars_framework-1.2.9}/MANIFEST.in +0 -0
  11. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/__init__.py +0 -0
  12. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/all.py +0 -0
  13. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/cli/__init__.py +0 -0
  14. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/cli/doctor/__init__.py +0 -0
  15. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/cli/doctor/detect.py +0 -0
  16. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/cli/doctor/doctor.py +0 -0
  17. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/cli/doctor/installers.py +0 -0
  18. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/cli/doctor/persist.py +0 -0
  19. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/cli/doctor/preflight.py +0 -0
  20. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/cli/doctor/ui.py +0 -0
  21. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/cli/hot_reload.py +0 -0
  22. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/cli/preview.py +0 -0
  23. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/cli/translations.py +0 -0
  24. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/__init__.py +0 -0
  25. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/advanced/__init__.py +0 -0
  26. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/advanced/accordion.py +0 -0
  27. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/advanced/card.py +0 -0
  28. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/advanced/modal.py +0 -0
  29. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/advanced/navbar.py +0 -0
  30. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/advanced/table.py +0 -0
  31. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/advanced/tabs.py +0 -0
  32. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/__init__.py +0 -0
  33. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/button.py +0 -0
  34. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/checkbox.py +0 -0
  35. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/container.py +0 -0
  36. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/datepicker.py +0 -0
  37. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/image.py +0 -0
  38. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/input.py +0 -0
  39. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/link.py +0 -0
  40. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/markdown.py +0 -0
  41. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/page.py +0 -0
  42. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/progressbar.py +0 -0
  43. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/radiobutton.py +0 -0
  44. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/select.py +0 -0
  45. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/slider.py +0 -0
  46. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/spinner.py +0 -0
  47. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/text.py +0 -0
  48. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/textarea.py +0 -0
  49. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/basic/tooltip.py +0 -0
  50. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/layout/__init__.py +0 -0
  51. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/layout/anchor.py +0 -0
  52. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/layout/flex.py +0 -0
  53. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/components/layout/grid.py +0 -0
  54. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/core/__init__.py +0 -0
  55. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/core/app.py +0 -0
  56. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/core/component.py +0 -0
  57. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/core/events.py +0 -0
  58. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/core/js_bridge.py +0 -0
  59. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/core/properties.py +0 -0
  60. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/core/state.py +0 -0
  61. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/dars_tests/apps_test/health_check.py +0 -0
  62. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/dars_tests/run_tests.py +0 -0
  63. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/dars_tests/tests/test_advanced_components.py +0 -0
  64. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/dars_tests/tests/test_basic_components.py +0 -0
  65. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/dars_tests/tests/test_core_and_cli.py +0 -0
  66. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/dars_tests/tests/test_layout_components.py +0 -0
  67. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/dars_tests/tests/test_version_check.py +0 -0
  68. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/docs/__init__.py +0 -0
  69. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/docs/app.md +0 -0
  70. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/docs/cli.md +0 -0
  71. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/docs/components.md +0 -0
  72. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/docs/custom_components.md +0 -0
  73. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/docs/events.md +0 -0
  74. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/docs/exporters.md +0 -0
  75. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/docs/getting_started.md +0 -0
  76. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/docs/index.md +0 -0
  77. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/docs/scripts.md +0 -0
  78. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/docs/state_management.md +0 -0
  79. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/exporters/__init__.py +0 -0
  80. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/exporters/base.py +0 -0
  81. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/exporters/web/OLD/html_css_js_OLD4.py +0 -0
  82. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/exporters/web/OLD/html_css_js_old.py +0 -0
  83. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/exporters/web/OLD/html_css_js_old2.py +0 -0
  84. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/exporters/web/__init__.py +0 -0
  85. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/exporters/web/html_css_js.py +0 -0
  86. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/exporters/web/vdom.py +0 -0
  87. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/js_lib.py +0 -0
  88. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/scripts/__init__.py +0 -0
  89. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/scripts/dscript.py +0 -0
  90. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/scripts/script.py +0 -0
  91. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/__init__.py +0 -0
  92. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/__pycache__/__init__.cpython-311.pyc +0 -0
  93. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/README.md +0 -0
  94. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/__pycache__/dynamic_event_demo.cpython-311.pyc +0 -0
  95. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/advanced/Modal_Demo/advanced_modal_demo.py +0 -0
  96. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/advanced/SimpleDashboard/dashboard.py +0 -0
  97. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/advanced/SimpleModermWeb/modern_web_app.py +0 -0
  98. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/advanced/VariousComponents/all_components_demo.py +0 -0
  99. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/advanced/__init__.py +0 -0
  100. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/advanced/dState/state_mods_demo.py +0 -0
  101. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/basic/Forms/form_components.py +0 -0
  102. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/basic/Forms/simple_form.py +0 -0
  103. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/basic/HelloWorld/hello_world.py +0 -0
  104. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/basic/Layouts/flex_layout_responsive.py +0 -0
  105. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/basic/Layouts/grid_layout_responsive.py +0 -0
  106. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/basic/Layouts/layout_multipage_demo.py +0 -0
  107. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/basic/Multipage/multipage_example.py +0 -0
  108. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/basic/PWA/icon-192x192.png +0 -0
  109. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/basic/PWA/icon-512x512.png +0 -0
  110. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/basic/PWA/pwa_custom_icons.py +0 -0
  111. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/basic/__init__.py +0 -0
  112. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/demo/__pycache__/complete_app.cpython-311.pyc +0 -0
  113. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/demo/complete_app.py +0 -0
  114. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/markdown/MarkdownTemplate/README.md +0 -0
  115. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/markdown/MarkdownTemplate/markdown_template.py +0 -0
  116. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/markdown/MarkdownTemplate/other_docs.md +0 -0
  117. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/examples/markdown/__init__.py +0 -0
  118. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars/templates/html/__init__.py +0 -0
  119. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars_framework.egg-info/SOURCES.txt +0 -0
  120. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars_framework.egg-info/dependency_links.txt +0 -0
  121. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars_framework.egg-info/entry_points.txt +0 -0
  122. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars_framework.egg-info/requires.txt +0 -0
  123. {dars_framework-1.2.7 → dars_framework-1.2.9}/dars_framework.egg-info/top_level.txt +0 -0
  124. {dars_framework-1.2.7 → dars_framework-1.2.9}/setup.cfg +0 -0
@@ -1,6 +1,6 @@
1
1
  Metadata-Version: 2.4
2
2
  Name: dars_framework
3
- Version: 1.2.7
3
+ Version: 1.2.9
4
4
  Summary: Dars is a Python UI framework for building modern, interactive web apps with only Python code. Write your interface in Python, export it to static HTML/CSS/JS, and deploy anywhere.
5
5
  Author-email: ztamdev <ztadevs@gmail.com>
6
6
  License-Expression: MIT
@@ -210,6 +210,7 @@ Example default:
210
210
  "include": [],
211
211
  "exclude": ["**/__pycache__", ".git", ".venv", "node_modules"],
212
212
  "bundle": true,
213
+ "defaultMinify": true,
213
214
  "viteMinify": true
214
215
  }
215
216
  ```
@@ -220,7 +221,8 @@ Example default:
220
221
  - `publicDir`: Folder (e.g., `public/` or `assets/`) copied into the output. If null, it is autodetected.
221
222
  - `include`/`exclude`: Basic filters for copying from `publicDir`.
222
223
  - `bundle`: Reserved for future use. CLI exports and build already bundle appropriately.
223
- - `viteMinify`: Toggle the Vite-based minifier for JS. When `false`, the build uses esbuild-based minification. If neither is available, a conservative Python fallback is used.
224
+ - `defaultMinify`: Toggle the built-in Python minifier (safe, conservatively preserves `<pre>`, `<code>`, `script`, `style`, `textarea`). Controls HTML minification and provides JS/CSS fallback when advanced tools are unavailable. Default `true`.
225
+ - `viteMinify`: Toggle the Vite/esbuild minifier for JS/CSS. Default `true`.
224
226
 
225
227
  Validate your config:
226
228
 
@@ -243,3 +245,40 @@ dars export config --format html
243
245
  ---
244
246
 
245
247
  See LandingPage docs for details: state_management.md, events.md, scripts.md.
248
+
249
+ ## More
250
+
251
+ - Visit dars [official website](https://ztamdev.github.io/Dars-Framework/)
252
+ - Visit the dars official [Documentation](https://ztamdev.github.io/Dars-Framework/documentation.html) now on separate website.
253
+ - Try dars without installing nothing just visit the [Dars Playground](https://dars-playground.vercel.app/)
254
+
255
+ ## Local Execution and Live Preview
256
+
257
+ To test your app locally before exporting, use the hot-reload preview from any Python file that defines your app:
258
+
259
+ ```python
260
+ if __name__ == "__main__":
261
+ app.rTimeCompile()
262
+ ```
263
+
264
+ Then run your file directly:
265
+
266
+ ```bash
267
+ python my_app.py
268
+ ```
269
+
270
+ This will start a local server at http://localhost:8000 so you can view your app in the browser—no manual export needed. You can change the port with:
271
+
272
+ ```bash
273
+ python my_app.py --port 8088
274
+ ```
275
+
276
+ ---
277
+
278
+ You can also use the CLI preview command on an exported app:
279
+
280
+ ```bash
281
+ dars preview ./my_exported_app
282
+ ```
283
+
284
+ This will start a local server at http://localhost:8000 to view your exported app in the browser.
@@ -1,20 +1,3 @@
1
- Metadata-Version: 2.4
2
- Name: dars_framework
3
- Version: 1.2.7
4
- Summary: Dars is a Python UI framework for building modern, interactive web apps with only Python code. Write your interface in Python, export it to static HTML/CSS/JS, and deploy anywhere.
5
- Author-email: ztamdev <ztadevs@gmail.com>
6
- License-Expression: MIT
7
- Description-Content-Type: text/markdown
8
- License-File: LICENSE
9
- Requires-Dist: rich==14.2.0
10
- Requires-Dist: bs4==0.0.2
11
- Requires-Dist: uvicorn==0.35.0
12
- Requires-Dist: fastapi==0.116.1
13
- Requires-Dist: markdown2==2.5.4
14
- Requires-Dist: requests==2.32.5
15
- Requires-Dist: rjsmin==1.2.5
16
- Dynamic: license-file
17
-
18
1
  <h1 align="center">Dars Framework</h1>
19
2
 
20
3
  <p align="center">
@@ -38,208 +21,247 @@ Try dars without installing nothing just visit the [Dars Playground](https://dar
38
21
  - Preview instantly with hot-reload using `app.rTimeCompile()`.
39
22
  - Export your app to static web files with a single CLI command.
40
23
  - Use multipage, layouts, scripts, and more—see docs for advanced features.
41
- - For more information visit the [Documentation](https://ztamdev.github.io/Dars-Framework/documentation.html)
42
-
43
- ## Quick Example: Your First App
44
- ```python
45
- from dars.all import *
46
-
47
- app = App(title="Hello World", theme="dark")
48
- # Crear componentes
49
- index = Page(
50
- Text(
51
- text="Hello World",
52
- style={
53
- 'font-size': '48px',
54
- 'color': '#2c3e50',
55
- 'margin-bottom': '20px',
56
- 'font-weight': 'bold',
57
- 'text-align': 'center'
58
- }
59
- ),
60
- Text(
61
- text="Hello World",
62
- style={
63
- 'font-size': '20px',
64
- 'color': '#7f8c8d',
65
- 'margin-bottom': '40px',
66
- 'text-align': 'center'
67
- }
68
- ),
69
-
70
- Button(
71
- text="Click Me!",
72
- on_click= dScript("alert('Hello World')"),
73
- on_mouse_enter=dScript("this.style.backgroundColor = '#2980b9';"),
74
- on_mouse_leave=dScript("this.style.backgroundColor = '#3498db';"),
75
- style={
76
- 'background-color': '#3498db',
77
- 'color': 'white',
78
- 'padding': '15px 30px',
79
- 'border': 'none',
80
- 'border-radius': '8px',
81
- 'font-size': '18px',
82
- 'cursor': 'pointer',
83
- 'transition': 'background-color 0.3s'
84
- }
85
- ),
86
- style={
87
- 'display': 'flex',
88
- 'flex-direction': 'column',
89
- 'align-items': 'center',
90
- 'justify-content': 'center',
91
- 'min-height': '100vh',
92
- 'background-color': '#f0f2f5',
93
- 'font-family': 'Arial, sans-serif'
94
- }
95
- )
96
- index.attr()
97
- app.add_page("index", index, title="Hello World", index=True)
98
-
99
- if __name__ == "__main__":
100
- app.rTimeCompile()
101
-
102
- ```
103
-
104
- ---
105
-
106
- ## Reactivity and State System
107
-
108
- **Dars Framework** includes a built-in **reactive state system** (`dState` / `cState`) that allows dynamic and modular DOM updates directly from Python.
109
- It enables fully event-driven interfaces without requiring manual JavaScript.
110
-
111
- ### Key Concepts
112
-
113
- * **`dState(name, component, states)`**
114
- Creates a reactive state controller bound to a specific component and a list of possible states.
115
-
116
- * **`cState(idx, mods=[...])`**
117
- Defines rules (modifications) that are automatically applied when entering a specific state.
118
-
119
- * **`Mod` Helpers**
120
- A compact way to modify DOM elements on state changes: `inc`, `dec`, `set`, `toggle_class`, `append_text`, `prepend_text`, `goto`, and more.
121
-
122
- * **Deferred Mutations**
123
- Using `component.attr(..., defer=True)` or `component.mod(...)` inside a `cComp=True` state defers HTML updates until an event occurs, preventing authoring-time mutations.
124
-
125
- ### Example Template
126
-
127
- A complete example demonstrating `dState`, `cState`, `Mod`, and deferred updates is available [here](https://github.com/ZtaMDev/Dars-Framework/blob/CrystalMain/dars/templates/examples/advanced/dState/state_mods_demo.py)
128
-
129
- <img width="384" height="187" alt="imagen" src="https://github.com/user-attachments/assets/7750ee7f-768f-48da-94df-2fa00339a99c" /> <img width="361" height="215" alt="imagen" src="https://github.com/user-attachments/assets/9b8a3e67-2424-49b4-aee0-9f1c0f747d66" />
130
-
131
-
132
-
133
- ### Features
134
-
135
- * Reactive Mod system with compact `Mod` helpers
136
- * Unified event model — any component can use `on_*` props (`on_click`, `on_input`, `on_change`, etc.)
137
- * Deferred rendering for safer, predictable state transitions (`cComp=True`)
138
- * Navigation between states using `goto`, including relative moves (`'+1'`, `'-1'`)
139
- * Consistent, event-time mutation flow for reliable behavior
140
- * Secure minification for production bundles (strong JS/CSS minifier integrated into the build pipeline)
141
-
142
- ---
143
-
144
- ## CLI Usage
145
- | Command | What it does |
146
- |-----------------------------------------|--------------------------------------------|
147
- | `dars export my_app.py --format html` | Export app to HTML/CSS/JS in `./my_app_web` |
148
- | `dars preview ./my_app_web` | Preview exported app locally |
149
- | `dars init my_project` | Create a new Dars project (also creates dars.config.json) |
150
- | `dars init --update` | Create/Update dars.config.json in current dir |
151
- | `dars build` | Build using dars.config.json (entry/outdir/format) |
152
- | `dars config validate` | Validate dars.config.json and print report |
153
- | `dars info my_app.py` | Show info about your app |
154
- | `dars formats` | List supported export formats |
155
- | `dars --help` | Show help and all CLI options |
156
-
157
- Tip: use `dars doctor` to review optional tooling that can enhance bundling/minification.
158
-
159
- ## More
160
-
161
- - Visit dars [official website](https://ztamdev.github.io/Dars-Framework/)
162
- - Visit the dars official [Documentation](https://ztamdev.github.io/Dars-Framework/documentation.html) now on separate website.
163
- - Try dars without installing nothing just visit the [Dars Playground](https://dars-playground.vercel.app/)
164
-
165
- ## Local Execution and Live Preview
166
-
167
- To test your app locally before exporting, use the hot-reload preview from any Python file that defines your app:
168
-
169
- ```python
170
- if __name__ == "__main__":
171
- app.rTimeCompile()
172
- ```
173
-
174
- Then run your file directly:
175
-
176
- ```bash
177
- python my_app.py
178
- ```
179
-
180
- This will start a local server at http://localhost:8000 so you can view your app in the browser—no manual export needed. You can change the port with:
181
-
182
- ```bash
183
- python my_app.py --port 8088
184
- ```
185
-
186
- ---
187
-
188
- You can also use the CLI preview command on an exported app:
189
-
190
- ```bash
191
- dars preview ./my_exported_app
192
- ```
193
-
194
- This will start a local server at http://localhost:8000 to view your exported app in the browser.
195
-
196
- ---
197
-
198
- ## Project Configuration (dars.config.json)
199
-
200
- Dars can read build/export settings from a `dars.config.json` at your project root. It is created automatically by `dars init`, and you can add it to existing projects with `dars init --update`.
201
-
202
- Example default:
203
-
204
- ```json
205
- {
206
- "entry": "main.py",
207
- "format": "html",
208
- "outdir": "dist",
209
- "publicDir": null,
210
- "include": [],
211
- "exclude": ["**/__pycache__", ".git", ".venv", "node_modules"],
212
- "bundle": true,
213
- "viteMinify": true
214
- }
215
- ```
216
-
217
- - `entry`: Python entry file. Used by `dars build` and `dars export config`.
218
- - `format`: Export format. Currently only `html` is supported.
219
- - `outdir`: Output directory. Used by `dars build` and default for `dars export` when not overridden.
220
- - `publicDir`: Folder (e.g., `public/` or `assets/`) copied into the output. If null, it is autodetected.
221
- - `include`/`exclude`: Basic filters for copying from `publicDir`.
222
- - `bundle`: Reserved for future use. CLI exports and build already bundle appropriately.
223
- - `viteMinify`: Toggle the Vite-based minifier for JS. When `false`, the build uses esbuild-based minification. If neither is available, a conservative Python fallback is used.
224
-
225
- Validate your config:
226
-
227
- ```bash
228
- dars config validate
229
- ```
230
-
231
- Build using config:
232
-
233
- ```bash
234
- dars build
235
- ```
236
-
237
- Export using the config entry and outdir:
238
-
239
- ```bash
240
- dars export config --format html
241
- ```
242
-
243
- ---
244
-
245
- See LandingPage docs for details: state_management.md, events.md, scripts.md.
24
+ - For more information visit the [Documentation](https://ztamdev.github.io/Dars-Framework/documentation.html)
25
+
26
+ ## Quick Example: Your First App
27
+ ```python
28
+ from dars.all import *
29
+
30
+ app = App(title="Hello World", theme="dark")
31
+ # Crear componentes
32
+ index = Page(
33
+ Text(
34
+ text="Hello World",
35
+ style={
36
+ 'font-size': '48px',
37
+ 'color': '#2c3e50',
38
+ 'margin-bottom': '20px',
39
+ 'font-weight': 'bold',
40
+ 'text-align': 'center'
41
+ }
42
+ ),
43
+ Text(
44
+ text="Hello World",
45
+ style={
46
+ 'font-size': '20px',
47
+ 'color': '#7f8c8d',
48
+ 'margin-bottom': '40px',
49
+ 'text-align': 'center'
50
+ }
51
+ ),
52
+
53
+ Button(
54
+ text="Click Me!",
55
+ on_click= dScript("alert('Hello World')"),
56
+ on_mouse_enter=dScript("this.style.backgroundColor = '#2980b9';"),
57
+ on_mouse_leave=dScript("this.style.backgroundColor = '#3498db';"),
58
+ style={
59
+ 'background-color': '#3498db',
60
+ 'color': 'white',
61
+ 'padding': '15px 30px',
62
+ 'border': 'none',
63
+ 'border-radius': '8px',
64
+ 'font-size': '18px',
65
+ 'cursor': 'pointer',
66
+ 'transition': 'background-color 0.3s'
67
+ }
68
+ ),
69
+ style={
70
+ 'display': 'flex',
71
+ 'flex-direction': 'column',
72
+ 'align-items': 'center',
73
+ 'justify-content': 'center',
74
+ 'min-height': '100vh',
75
+ 'background-color': '#f0f2f5',
76
+ 'font-family': 'Arial, sans-serif'
77
+ }
78
+ )
79
+ index.attr()
80
+ app.add_page("index", index, title="Hello World", index=True)
81
+
82
+ if __name__ == "__main__":
83
+ app.rTimeCompile()
84
+
85
+ ```
86
+
87
+ ---
88
+
89
+ ## Reactivity and State System
90
+
91
+ **Dars Framework** includes a built-in **reactive state system** (`dState` / `cState`) that allows dynamic and modular DOM updates directly from Python.
92
+ It enables fully event-driven interfaces without requiring manual JavaScript.
93
+
94
+ ### Key Concepts
95
+
96
+ * **`dState(name, component, states)`**
97
+ Creates a reactive state controller bound to a specific component and a list of possible states.
98
+
99
+ * **`cState(idx, mods=[...])`**
100
+ Defines rules (modifications) that are automatically applied when entering a specific state.
101
+
102
+ * **`Mod` Helpers**
103
+ A compact way to modify DOM elements on state changes: `inc`, `dec`, `set`, `toggle_class`, `append_text`, `prepend_text`, `goto`, and more.
104
+
105
+ * **Deferred Mutations**
106
+ Using `component.attr(..., defer=True)` or `component.mod(...)` inside a `cComp=True` state defers HTML updates until an event occurs, preventing authoring-time mutations.
107
+
108
+ ### Example Template
109
+
110
+ A complete example demonstrating `dState`, `cState`, `Mod`, and deferred updates is available [here](https://github.com/ZtaMDev/Dars-Framework/blob/CrystalMain/dars/templates/examples/advanced/dState/state_mods_demo.py)
111
+
112
+ <img width="384" height="187" alt="imagen" src="https://github.com/user-attachments/assets/7750ee7f-768f-48da-94df-2fa00339a99c" /> <img width="361" height="215" alt="imagen" src="https://github.com/user-attachments/assets/9b8a3e67-2424-49b4-aee0-9f1c0f747d66" />
113
+
114
+
115
+
116
+ ### Features
117
+
118
+ * Reactive Mod system with compact `Mod` helpers
119
+ * Unified event model — any component can use `on_*` props (`on_click`, `on_input`, `on_change`, etc.)
120
+ * Deferred rendering for safer, predictable state transitions (`cComp=True`)
121
+ * Navigation between states using `goto`, including relative moves (`'+1'`, `'-1'`)
122
+ * Consistent, event-time mutation flow for reliable behavior
123
+ * Secure minification for production bundles (strong JS/CSS minifier integrated into the build pipeline)
124
+
125
+ ---
126
+
127
+ ## CLI Usage
128
+ | Command | What it does |
129
+ |-----------------------------------------|--------------------------------------------|
130
+ | `dars export my_app.py --format html` | Export app to HTML/CSS/JS in `./my_app_web` |
131
+ | `dars preview ./my_app_web` | Preview exported app locally |
132
+ | `dars init my_project` | Create a new Dars project (also creates dars.config.json) |
133
+ | `dars init --update` | Create/Update dars.config.json in current dir |
134
+ | `dars build` | Build using dars.config.json (entry/outdir/format) |
135
+ | `dars config validate` | Validate dars.config.json and print report |
136
+ | `dars info my_app.py` | Show info about your app |
137
+ | `dars formats` | List supported export formats |
138
+ | `dars --help` | Show help and all CLI options |
139
+
140
+ Tip: use `dars doctor` to review optional tooling that can enhance bundling/minification.
141
+
142
+ ## More
143
+
144
+ - Visit dars [official website](https://ztamdev.github.io/Dars-Framework/)
145
+ - Visit the dars official [Documentation](https://ztamdev.github.io/Dars-Framework/documentation.html) now on separate website.
146
+ - Try dars without installing nothing just visit the [Dars Playground](https://dars-playground.vercel.app/)
147
+
148
+ ## Local Execution and Live Preview
149
+
150
+ To test your app locally before exporting, use the hot-reload preview from any Python file that defines your app:
151
+
152
+ ```python
153
+ if __name__ == "__main__":
154
+ app.rTimeCompile()
155
+ ```
156
+
157
+ Then run your file directly:
158
+
159
+ ```bash
160
+ python my_app.py
161
+ ```
162
+
163
+ This will start a local server at http://localhost:8000 so you can view your app in the browser—no manual export needed. You can change the port with:
164
+
165
+ ```bash
166
+ python my_app.py --port 8088
167
+ ```
168
+
169
+ ---
170
+
171
+ You can also use the CLI preview command on an exported app:
172
+
173
+ ```bash
174
+ dars preview ./my_exported_app
175
+ ```
176
+
177
+ This will start a local server at http://localhost:8000 to view your exported app in the browser.
178
+
179
+ ---
180
+
181
+ ## Project Configuration (dars.config.json)
182
+
183
+ Dars can read build/export settings from a `dars.config.json` at your project root. It is created automatically by `dars init`, and you can add it to existing projects with `dars init --update`.
184
+
185
+ Example default:
186
+
187
+ ```json
188
+ {
189
+ "entry": "main.py",
190
+ "format": "html",
191
+ "outdir": "dist",
192
+ "publicDir": null,
193
+ "include": [],
194
+ "exclude": ["**/__pycache__", ".git", ".venv", "node_modules"],
195
+ "bundle": true,
196
+ "defaultMinify": true,
197
+ "viteMinify": true
198
+ }
199
+ ```
200
+
201
+ - `entry`: Python entry file. Used by `dars build` and `dars export config`.
202
+ - `format`: Export format. Currently only `html` is supported.
203
+ - `outdir`: Output directory. Used by `dars build` and default for `dars export` when not overridden.
204
+ - `publicDir`: Folder (e.g., `public/` or `assets/`) copied into the output. If null, it is autodetected.
205
+ - `include`/`exclude`: Basic filters for copying from `publicDir`.
206
+ - `bundle`: Reserved for future use. CLI exports and build already bundle appropriately.
207
+ - `defaultMinify`: Toggle the built-in Python minifier (safe, conservatively preserves `<pre>`, `<code>`, `script`, `style`, `textarea`). Controls HTML minification and provides JS/CSS fallback when advanced tools are unavailable. Default `true`.
208
+ - `viteMinify`: Toggle the Vite/esbuild minifier for JS/CSS. Default `true`.
209
+
210
+ Validate your config:
211
+
212
+ ```bash
213
+ dars config validate
214
+ ```
215
+
216
+ Build using config:
217
+
218
+ ```bash
219
+ dars build
220
+ ```
221
+
222
+ Export using the config entry and outdir:
223
+
224
+ ```bash
225
+ dars export config --format html
226
+ ```
227
+
228
+ ---
229
+
230
+ See LandingPage docs for details: state_management.md, events.md, scripts.md.
231
+
232
+ ## More
233
+
234
+ - Visit dars [official website](https://ztamdev.github.io/Dars-Framework/)
235
+ - Visit the dars official [Documentation](https://ztamdev.github.io/Dars-Framework/documentation.html) now on separate website.
236
+ - Try dars without installing nothing just visit the [Dars Playground](https://dars-playground.vercel.app/)
237
+
238
+ ## Local Execution and Live Preview
239
+
240
+ To test your app locally before exporting, use the hot-reload preview from any Python file that defines your app:
241
+
242
+ ```python
243
+ if __name__ == "__main__":
244
+ app.rTimeCompile()
245
+ ```
246
+
247
+ Then run your file directly:
248
+
249
+ ```bash
250
+ python my_app.py
251
+ ```
252
+
253
+ This will start a local server at http://localhost:8000 so you can view your app in the browser—no manual export needed. You can change the port with:
254
+
255
+ ```bash
256
+ python my_app.py --port 8088
257
+ ```
258
+
259
+ ---
260
+
261
+ You can also use the CLI preview command on an exported app:
262
+
263
+ ```bash
264
+ dars preview ./my_exported_app
265
+ ```
266
+
267
+ This will start a local server at http://localhost:8000 to view your exported app in the browser.