SaaS-FrameWork 0.1.1__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.
- saas_framework-0.1.1/MANIFEST.in +16 -0
- saas_framework-0.1.1/PKG-INFO +450 -0
- saas_framework-0.1.1/README.md +427 -0
- saas_framework-0.1.1/SaaS_FrameWork.egg-info/SOURCES.txt +81 -0
- saas_framework-0.1.1/components/__init__.py +119 -0
- saas_framework-0.1.1/components/buttons/DEx_BtnFAB.py +37 -0
- saas_framework-0.1.1/components/buttons/DEx_BtnFilled.py +20 -0
- saas_framework-0.1.1/components/buttons/DEx_BtnGhost.py +20 -0
- saas_framework-0.1.1/components/buttons/DEx_BtnIcon.py +18 -0
- saas_framework-0.1.1/components/buttons/DEx_BtnPrimary.py +21 -0
- saas_framework-0.1.1/components/buttons/DEx_BtnSegmented.py +45 -0
- saas_framework-0.1.1/components/buttons/DEx_BtnText.py +19 -0
- saas_framework-0.1.1/components/buttons/DEx_BtnTonal.py +20 -0
- saas_framework-0.1.1/components/buttons/DEx_MenuBar.py +61 -0
- saas_framework-0.1.1/components/buttons/DEx_PopupMenu.py +43 -0
- saas_framework-0.1.1/components/buttons/__init__.py +0 -0
- saas_framework-0.1.1/components/cards/DEx_Card.py +23 -0
- saas_framework-0.1.1/components/cards/DEx_ContactCard.py +52 -0
- saas_framework-0.1.1/components/cards/DEx_MetricCard.py +36 -0
- saas_framework-0.1.1/components/cards/__init__.py +0 -0
- saas_framework-0.1.1/components/data/DEx_DataTable.py +82 -0
- saas_framework-0.1.1/components/data/DEx_ExpansionPanel.py +39 -0
- saas_framework-0.1.1/components/data/DEx_ExpansionTile.py +29 -0
- saas_framework-0.1.1/components/data/DEx_GridView.py +65 -0
- saas_framework-0.1.1/components/data/DEx_ListTile.py +27 -0
- saas_framework-0.1.1/components/data/DEx_ListView.py +65 -0
- saas_framework-0.1.1/components/data/DEx_PipelineColumn.py +74 -0
- saas_framework-0.1.1/components/data/DEx_TreeView.py +536 -0
- saas_framework-0.1.1/components/data/__init__.py +0 -0
- saas_framework-0.1.1/components/feedback/DEx_AlertDialog.py +26 -0
- saas_framework-0.1.1/components/feedback/DEx_Banner.py +19 -0
- saas_framework-0.1.1/components/feedback/DEx_BottomSheet.py +37 -0
- saas_framework-0.1.1/components/feedback/DEx_Notify.py +15 -0
- saas_framework-0.1.1/components/feedback/DEx_ProgressBar.py +34 -0
- saas_framework-0.1.1/components/feedback/DEx_ProgressRing.py +52 -0
- saas_framework-0.1.1/components/feedback/DEx_Shimmer.py +84 -0
- saas_framework-0.1.1/components/feedback/DEx_Tooltip.py +24 -0
- saas_framework-0.1.1/components/feedback/__init__.py +0 -0
- saas_framework-0.1.1/components/inputs/DEx_AutoComplete.py +29 -0
- saas_framework-0.1.1/components/inputs/DEx_Checkbox.py +27 -0
- saas_framework-0.1.1/components/inputs/DEx_Chip.py +33 -0
- saas_framework-0.1.1/components/inputs/DEx_DatePicker.py +72 -0
- saas_framework-0.1.1/components/inputs/DEx_Dropdown.py +25 -0
- saas_framework-0.1.1/components/inputs/DEx_FilePicker.py +70 -0
- saas_framework-0.1.1/components/inputs/DEx_Radio.py +37 -0
- saas_framework-0.1.1/components/inputs/DEx_SearchBar.py +37 -0
- saas_framework-0.1.1/components/inputs/DEx_SearchField.py +9 -0
- saas_framework-0.1.1/components/inputs/DEx_Slider.py +49 -0
- saas_framework-0.1.1/components/inputs/DEx_Switch.py +22 -0
- saas_framework-0.1.1/components/inputs/DEx_TextField.py +29 -0
- saas_framework-0.1.1/components/inputs/DEx_TimePicker.py +71 -0
- saas_framework-0.1.1/components/inputs/__init__.py +0 -0
- saas_framework-0.1.1/components/layout/DEx_AnimatedSwitcher.py +43 -0
- saas_framework-0.1.1/components/layout/DEx_AppBar.py +48 -0
- saas_framework-0.1.1/components/layout/DEx_AppShell.py +80 -0
- saas_framework-0.1.1/components/layout/DEx_Draggable.py +67 -0
- saas_framework-0.1.1/components/layout/DEx_GestureDetector.py +52 -0
- saas_framework-0.1.1/components/layout/DEx_Header.py +57 -0
- saas_framework-0.1.1/components/layout/DEx_NavItem.py +61 -0
- saas_framework-0.1.1/components/layout/DEx_NavigationBar.py +30 -0
- saas_framework-0.1.1/components/layout/DEx_NavigationDrawer.py +60 -0
- saas_framework-0.1.1/components/layout/DEx_NavigationRail.py +42 -0
- saas_framework-0.1.1/components/layout/DEx_ResponsiveRow.py +42 -0
- saas_framework-0.1.1/components/layout/DEx_Sidebar.py +131 -0
- saas_framework-0.1.1/components/layout/DEx_Stack.py +73 -0
- saas_framework-0.1.1/components/layout/DEx_Tabs.py +110 -0
- saas_framework-0.1.1/components/layout/__init__.py +0 -0
- saas_framework-0.1.1/components/metadata.py +98 -0
- saas_framework-0.1.1/components/primitives/DEx_Avatar.py +87 -0
- saas_framework-0.1.1/components/primitives/DEx_Badge.py +18 -0
- saas_framework-0.1.1/components/primitives/DEx_Divider.py +13 -0
- saas_framework-0.1.1/components/primitives/DEx_Icon.py +46 -0
- saas_framework-0.1.1/components/primitives/DEx_Image.py +55 -0
- saas_framework-0.1.1/components/primitives/DEx_Markdown.py +21 -0
- saas_framework-0.1.1/components/primitives/DEx_SectionEyebrow.py +22 -0
- saas_framework-0.1.1/components/primitives/DEx_StatusDot.py +8 -0
- saas_framework-0.1.1/components/primitives/__init__.py +0 -0
- saas_framework-0.1.1/components/project.py +23 -0
- saas_framework-0.1.1/components/theme/DEx_ColorThemes.py +375 -0
- saas_framework-0.1.1/components/theme/DEx_Theme.py +136 -0
- saas_framework-0.1.1/components/theme/__init__.py +4 -0
- saas_framework-0.1.1/components/versioning.py +103 -0
- saas_framework-0.1.1/pyproject.toml +47 -0
- saas_framework-0.1.1/setup.cfg +4 -0
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
include README.md
|
|
2
|
+
include pyproject.toml
|
|
3
|
+
recursive-include components *.py
|
|
4
|
+
recursive-exclude * __pycache__ *.py[cod]
|
|
5
|
+
prune .github
|
|
6
|
+
prune .pytest_cache
|
|
7
|
+
prune .pytest_tmp
|
|
8
|
+
prune _base
|
|
9
|
+
prune build
|
|
10
|
+
prune catalog
|
|
11
|
+
prune *.egg-info
|
|
12
|
+
prune dist
|
|
13
|
+
prune docs
|
|
14
|
+
prune tests
|
|
15
|
+
prune use_cases
|
|
16
|
+
exclude files.zip
|
|
@@ -0,0 +1,450 @@
|
|
|
1
|
+
Metadata-Version: 2.4
|
|
2
|
+
Name: SaaS-FrameWork
|
|
3
|
+
Version: 0.1.1
|
|
4
|
+
Summary: SaaS-FrameWork - sistema de componentes reutilizaveis para apps SaaS construido com Python e Flet
|
|
5
|
+
Author-email: Almir Duarte <almir.jg@gmail.com>
|
|
6
|
+
License-Expression: MIT
|
|
7
|
+
Project-URL: Repository, https://github.com/DEx-SaaS/FrameWork
|
|
8
|
+
Keywords: flet,saas,framework,ui,components,design-system
|
|
9
|
+
Classifier: Development Status :: 1 - Planning
|
|
10
|
+
Classifier: Intended Audience :: Developers
|
|
11
|
+
Classifier: Programming Language :: Python :: 3.13
|
|
12
|
+
Classifier: Topic :: Software Development :: User Interfaces
|
|
13
|
+
Requires-Python: >=3.13
|
|
14
|
+
Description-Content-Type: text/markdown
|
|
15
|
+
Requires-Dist: flet==0.84.0
|
|
16
|
+
Provides-Extra: dev
|
|
17
|
+
Requires-Dist: flet==0.84.0; extra == "dev"
|
|
18
|
+
Requires-Dist: pytest<10,>=9.1; extra == "dev"
|
|
19
|
+
Requires-Dist: build<2,>=1.3; extra == "dev"
|
|
20
|
+
Requires-Dist: twine<7,>=6.2; extra == "dev"
|
|
21
|
+
Provides-Extra: visual
|
|
22
|
+
Requires-Dist: playwright<2,>=1.40; extra == "visual"
|
|
23
|
+
|
|
24
|
+
# SaaS-FrameWork
|
|
25
|
+
|
|
26
|
+
Python 3.13 + Flet design framework for reusable SaaS UI components.
|
|
27
|
+
|
|
28
|
+
The project provides versioned UI components, isolated use cases, and a navigable component catalog.
|
|
29
|
+
|
|
30
|
+
## Versioning
|
|
31
|
+
|
|
32
|
+
Library, component, and release branch versions follow the same `vv.rr.bb` rule.
|
|
33
|
+
|
|
34
|
+
The library version is declared in `pyproject.toml`:
|
|
35
|
+
|
|
36
|
+
```toml
|
|
37
|
+
[project]
|
|
38
|
+
version = "0.1.1"
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
Use cases and the catalog header read this version through `components/project.py`. Do not duplicate the project version manually in UI files.
|
|
42
|
+
|
|
43
|
+
Each public component exposes its own version:
|
|
44
|
+
|
|
45
|
+
```python
|
|
46
|
+
COMPONENT_VERSION = "0.0.1"
|
|
47
|
+
```
|
|
48
|
+
|
|
49
|
+
Release branches must use the same format as the branch name:
|
|
50
|
+
|
|
51
|
+
```text
|
|
52
|
+
0.1.1
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
Do not prefix release branch names with `v`, `release/`, or any other text.
|
|
56
|
+
|
|
57
|
+
The accepted format is:
|
|
58
|
+
|
|
59
|
+
```text
|
|
60
|
+
vv.rr.bb
|
|
61
|
+
0.0.0 through 99.99.99
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
Segment meaning:
|
|
65
|
+
|
|
66
|
+
- `vv`: version. Increment for large changes that alter visual form, public API, or how the library/component is used.
|
|
67
|
+
- `rr`: release. Increment for small scoped changes, such as a specific behavior or item adjustment.
|
|
68
|
+
- `bb`: bug correction. Increment when a bug is fixed.
|
|
69
|
+
|
|
70
|
+
Every library or component change must increment the relevant version. Each segment is incremented by one numeral. When `bb` reaches `99`, the next `bb` increment increments `rr` and resets `bb` to `0`. When `rr` reaches `99`, the next `rr` increment increments `vv` and resets `rr` to `0`.
|
|
71
|
+
|
|
72
|
+
Version helpers live in `components/versioning.py`:
|
|
73
|
+
|
|
74
|
+
- `validate_version(version)`
|
|
75
|
+
- `validate_branch_version(branch_name)`
|
|
76
|
+
- `bump_version(version, segment="bugfix")`
|
|
77
|
+
- `ComponentMeta`
|
|
78
|
+
|
|
79
|
+
Catalog metadata lives in `components/metadata.py` and is the source of truth for component name, group, version, and description.
|
|
80
|
+
|
|
81
|
+
## Package Boundary
|
|
82
|
+
|
|
83
|
+
The distributable Python library is the `components` package.
|
|
84
|
+
|
|
85
|
+
The following folders are repository assets and are intentionally excluded from the wheel:
|
|
86
|
+
|
|
87
|
+
- `catalog/`: local visual catalog and inspection tool.
|
|
88
|
+
- `use_cases/`: executable examples for development and documentation.
|
|
89
|
+
- `docs/`: component documentation and generated structure images.
|
|
90
|
+
- `_base/`: preserved reference material.
|
|
91
|
+
|
|
92
|
+
This separation is enforced in `pyproject.toml` through `tool.setuptools.packages.find`.
|
|
93
|
+
|
|
94
|
+
Adding a public component requires all of the following:
|
|
95
|
+
|
|
96
|
+
- source file under `components/**/DEx_<Name>.py`
|
|
97
|
+
- `COMPONENT_VERSION` in the source file
|
|
98
|
+
- entry in `components/metadata.py`
|
|
99
|
+
- public export in `components/__init__.py`
|
|
100
|
+
- use case `use_cases/UC_<Name>_01.py`
|
|
101
|
+
- documentation `docs/components/Documentação/DEx_<Name>.md`
|
|
102
|
+
- four structure images in `docs/components/images/`
|
|
103
|
+
|
|
104
|
+
The repository governance tests fail when this contract is broken.
|
|
105
|
+
|
|
106
|
+
## Folder Structure
|
|
107
|
+
|
|
108
|
+
```text
|
|
109
|
+
DEx-FW_4/
|
|
110
|
+
|-- _base/ preserved original reference
|
|
111
|
+
|-- components/
|
|
112
|
+
| |-- buttons/
|
|
113
|
+
| |-- cards/
|
|
114
|
+
| |-- data/
|
|
115
|
+
| |-- feedback/
|
|
116
|
+
| |-- inputs/
|
|
117
|
+
| |-- layout/
|
|
118
|
+
| |-- primitives/
|
|
119
|
+
| |-- theme/
|
|
120
|
+
| |-- metadata.py
|
|
121
|
+
| |-- project.py
|
|
122
|
+
| `-- versioning.py
|
|
123
|
+
|-- use_cases/
|
|
124
|
+
| |-- _uc_template.py
|
|
125
|
+
| |-- UC_<Component>_<nn>.py
|
|
126
|
+
| |-- UC_TreeView_01.py
|
|
127
|
+
| `-- UC_ColorThemes_01.py
|
|
128
|
+
|-- catalog/
|
|
129
|
+
| `-- main.py
|
|
130
|
+
|-- docs/
|
|
131
|
+
|-- AGENTS.md
|
|
132
|
+
|-- pyproject.toml
|
|
133
|
+
`-- README.md
|
|
134
|
+
```
|
|
135
|
+
|
|
136
|
+
## Naming Convention
|
|
137
|
+
|
|
138
|
+
| Type | Pattern | Example |
|
|
139
|
+
|---|---|---|
|
|
140
|
+
| Component file | `DEx_<Name>.py` | `DEx_MetricCard.py` |
|
|
141
|
+
| Component factory/class | `DEx_<Name>` | `DEx_MetricCard()` |
|
|
142
|
+
| Use case | `UC_<Component>_<nn>.py` | `UC_MetricCard_01.py` |
|
|
143
|
+
|
|
144
|
+
## Environment
|
|
145
|
+
|
|
146
|
+
Documented local virtual environment:
|
|
147
|
+
|
|
148
|
+
```cmd
|
|
149
|
+
C:\Python\venv\.venv_313_FW
|
|
150
|
+
```
|
|
151
|
+
|
|
152
|
+
Run the catalog:
|
|
153
|
+
|
|
154
|
+
```cmd
|
|
155
|
+
call C:\Python\venv\.venv_313_FW\Scripts\activate.bat
|
|
156
|
+
flet run catalog/main.py
|
|
157
|
+
```
|
|
158
|
+
|
|
159
|
+
Run as web catalog:
|
|
160
|
+
|
|
161
|
+
```cmd
|
|
162
|
+
call C:\Python\venv\.venv_313_FW\Scripts\activate.bat
|
|
163
|
+
flet run --web --port 8550 catalog/main.py
|
|
164
|
+
```
|
|
165
|
+
|
|
166
|
+
Run a use case:
|
|
167
|
+
|
|
168
|
+
```cmd
|
|
169
|
+
call C:\Python\venv\.venv_313_FW\Scripts\activate.bat
|
|
170
|
+
flet run use_cases/UC_MetricCard_01.py
|
|
171
|
+
```
|
|
172
|
+
|
|
173
|
+
## Validation
|
|
174
|
+
|
|
175
|
+
Quick syntax validation:
|
|
176
|
+
|
|
177
|
+
```cmd
|
|
178
|
+
python -m compileall components use_cases catalog
|
|
179
|
+
```
|
|
180
|
+
|
|
181
|
+
Run the automated test suite:
|
|
182
|
+
|
|
183
|
+
```cmd
|
|
184
|
+
C:\Python\venv\.venv_313_FW\Scripts\python.exe -m pytest -q
|
|
185
|
+
```
|
|
186
|
+
|
|
187
|
+
Run optional visual screenshots:
|
|
188
|
+
|
|
189
|
+
```powershell
|
|
190
|
+
C:\Python\venv\.venv_313_FW\Scripts\python.exe -m playwright install chromium
|
|
191
|
+
$env:DEX_RUN_VISUAL_TESTS="1"
|
|
192
|
+
C:\Python\venv\.venv_313_FW\Scripts\python.exe -m pytest tests/test_visual_screenshots.py -q
|
|
193
|
+
```
|
|
194
|
+
|
|
195
|
+
Build and validate package metadata:
|
|
196
|
+
|
|
197
|
+
```cmd
|
|
198
|
+
C:\Python\venv\.venv_313_FW\Scripts\python.exe -m build
|
|
199
|
+
C:\Python\venv\.venv_313_FW\Scripts\python.exe -m twine check dist/*
|
|
200
|
+
```
|
|
201
|
+
|
|
202
|
+
Publish the package:
|
|
203
|
+
|
|
204
|
+
```powershell
|
|
205
|
+
.\tools\publish_package.ps1 --test
|
|
206
|
+
.\tools\publish_package.ps1 --prod
|
|
207
|
+
.\tools\publish_package.ps1 --both
|
|
208
|
+
.\tools\publish_package.ps1
|
|
209
|
+
```
|
|
210
|
+
|
|
211
|
+
Without flags, the script asks:
|
|
212
|
+
|
|
213
|
+
1. teste
|
|
214
|
+
2. prod
|
|
215
|
+
3. ambos
|
|
216
|
+
|
|
217
|
+
The script builds the package, checks the artifacts, and uploads to TestPyPI or PyPI based on the chosen destination.
|
|
218
|
+
|
|
219
|
+
With the documented Flet environment:
|
|
220
|
+
|
|
221
|
+
```cmd
|
|
222
|
+
C:\Python\venv\.venv_313_FW\Scripts\python.exe -c "import catalog.main as c; print(c.PROJECT_VERSION)"
|
|
223
|
+
```
|
|
224
|
+
|
|
225
|
+
## Catalog
|
|
226
|
+
|
|
227
|
+
The catalog entry point is `catalog/main.py`.
|
|
228
|
+
|
|
229
|
+
It follows the project window structure:
|
|
230
|
+
|
|
231
|
+
- header with project name, project version, and current branch
|
|
232
|
+
- left menu with component groups
|
|
233
|
+
- group context area with name and description
|
|
234
|
+
- component cards showing name, group, and component version
|
|
235
|
+
|
|
236
|
+
The catalog uses `components/metadata.py`; adding a component without adding metadata means it will not appear in the catalog.
|
|
237
|
+
|
|
238
|
+
## Design System
|
|
239
|
+
|
|
240
|
+
Main design tokens live in `components/theme/DEx_Theme.py`.
|
|
241
|
+
|
|
242
|
+
| Token | Hex | Use |
|
|
243
|
+
|---|---:|---|
|
|
244
|
+
| `ACCENT` | `#6C63FF` | Primary actions and active navigation |
|
|
245
|
+
| `DATA` | `#00E5C3` | Data highlights and metric accents |
|
|
246
|
+
| `BG_DEEP` | `#0D0F14` | Root background |
|
|
247
|
+
| `BG_SURFACE` | `#151820` | Cards and sidebar surfaces |
|
|
248
|
+
| `BG_ELEVATED` | `#1C2030` | Hover states, inputs, elevated surfaces |
|
|
249
|
+
| `BORDER` | `#1E2230` | Borders and dividers |
|
|
250
|
+
| `SUCCESS` | `#22C55E` | Positive status |
|
|
251
|
+
| `DANGER` | `#EF4444` | Error or negative status |
|
|
252
|
+
| `WARNING` | `#F59E0B` | Warning status |
|
|
253
|
+
|
|
254
|
+
Signature elements:
|
|
255
|
+
|
|
256
|
+
- numbered cyan eyebrows through `DEx_SectionEyebrow`
|
|
257
|
+
- 3px violet active indicator in `DEx_NavItem`
|
|
258
|
+
|
|
259
|
+
## Color Themes
|
|
260
|
+
|
|
261
|
+
Accessible 60-30-10 color themes live in `components/theme/DEx_ColorThemes.py`.
|
|
262
|
+
|
|
263
|
+
Each theme defines:
|
|
264
|
+
|
|
265
|
+
- `background`: 60% dominant color for windows, frames, and base containers
|
|
266
|
+
- `text`: 30% foreground color for typography, borders, cards, and tables
|
|
267
|
+
- `accent`: 10% highlight color for primary CTAs, badges, critical links, progress, and chart highlights
|
|
268
|
+
- `contrast_ratio`: documented text/background contrast
|
|
269
|
+
- `accessibility`: WCAG target such as `AAA` or `AA`
|
|
270
|
+
|
|
271
|
+
Available themes:
|
|
272
|
+
|
|
273
|
+
| Theme | Background | Text | Accent | Contrast | Status |
|
|
274
|
+
|---|---:|---:|---:|---:|---|
|
|
275
|
+
| Minimalismo Corporativo | `#FFFFFF` | `#000000` | `#0071E3` | `21:1` | AAA |
|
|
276
|
+
| Dark Mode de Alta Performance | `#111111` | `#FFFFFF` | `#FF6A13` | `18.88:1` | AAA |
|
|
277
|
+
| Confianca e Fintech | `#141432` | `#F4F5F7` | `#0079C1` | `16.37:1` | AAA |
|
|
278
|
+
| Organico e Bem-Estar | `#006241` | `#FFFFFF` | `#00A86B` | `7.44:1` | AAA |
|
|
279
|
+
| Alimentacao e Food Delivery | `#FAFAFA` | `#222222` | `#EA1D2C` | `15.24:1` | AAA |
|
|
280
|
+
| Area Automotiva | `#1E2229` | `#F3F4F6` | `#FFB800` / `#FF5500` | `14.50:1` | AAA |
|
|
281
|
+
| Tradicao e Robustez | `#F4F6F9` | `#003399` | `#003399` / `#FFFF00` | `10.03:1` | AAA |
|
|
282
|
+
| Modernidade Digital | `#FFFFFF` | `#820AD1` | `#820AD1` | `7.21:1` | AAA |
|
|
283
|
+
| Solidez e Dinamismo | `#FAFAFA` | `#0038A8` | `#FF6200` | `9.44:1` | AAA |
|
|
284
|
+
| Presenca Global e Energia | `#FFFFFF` | `#1C1C1C` | `#EC0000` | `17.04:1` | AAA |
|
|
285
|
+
|
|
286
|
+
Use:
|
|
287
|
+
|
|
288
|
+
```python
|
|
289
|
+
from components.theme.DEx_ColorThemes import get_color_theme
|
|
290
|
+
|
|
291
|
+
theme = get_color_theme("food_delivery")
|
|
292
|
+
page.bgcolor = theme.bg_primary
|
|
293
|
+
button.bgcolor = theme.accent_primary
|
|
294
|
+
```
|
|
295
|
+
|
|
296
|
+
Export CSS-style variables:
|
|
297
|
+
|
|
298
|
+
```python
|
|
299
|
+
theme.css_variables()
|
|
300
|
+
```
|
|
301
|
+
|
|
302
|
+
## Use Case Theme Switcher
|
|
303
|
+
|
|
304
|
+
The shared use case template in `use_cases/_uc_template.py` adds a palette button to the header.
|
|
305
|
+
|
|
306
|
+
Each click cycles through the current `DEx_ColorThemes` presets:
|
|
307
|
+
|
|
308
|
+
```text
|
|
309
|
+
Minimalismo Corporativo -> Dark Mode de Alta Performance -> Confianca e Fintech -> Organico e Bem-Estar -> Alimentacao e Food Delivery -> Area Automotiva -> Tradicao e Robustez -> Modernidade Digital -> Solidez e Dinamismo -> Presenca Global e Energia
|
|
310
|
+
```
|
|
311
|
+
|
|
312
|
+
The switcher applies the selected 60-30-10 theme to the page and retints mounted controls that use DEx token colors.
|
|
313
|
+
|
|
314
|
+
## Components
|
|
315
|
+
|
|
316
|
+
Total registered components: **67**.
|
|
317
|
+
|
|
318
|
+
### theme
|
|
319
|
+
|
|
320
|
+
Cores, espaçamento, tipografia e construção de tema compartilhados.
|
|
321
|
+
|
|
322
|
+
| Component | Version | Description |
|
|
323
|
+
|---|---:|---|
|
|
324
|
+
| `DEx_Theme` | `0.0.1` | Tokens de design e construtor de tema Flet. |
|
|
325
|
+
| `DEx_ColorThemes` | `0.0.1` | Temas de cor acessíveis 60-30-10 para aplicações DEx. |
|
|
326
|
+
|
|
327
|
+
### primitives
|
|
328
|
+
|
|
329
|
+
Elementos visuais atômicos para composição de controles maiores.
|
|
330
|
+
|
|
331
|
+
| Component | Version | Description |
|
|
332
|
+
|---|---:|---|
|
|
333
|
+
| `DEx_Badge` | `0.0.1` | Rótulo compacto de status e categoria. |
|
|
334
|
+
| `DEx_Divider` | `0.0.1` | Separador horizontal sutil. |
|
|
335
|
+
| `DEx_SectionEyebrow` | `0.0.1` | Marcador de seção numerado em ciano. |
|
|
336
|
+
| `DEx_StatusDot` | `0.0.1` | Indicador de estado colorido em miniatura. |
|
|
337
|
+
| `DEx_Avatar` | `0.0.1` | Avatar circular com iniciais coloridas e grupo com overflow. |
|
|
338
|
+
| `DEx_Image` | `0.0.1` | Imagem com bordas arredondadas e placeholder de estado vazio. |
|
|
339
|
+
| `DEx_Icon` | `0.0.1` | Ícone com tokens de tamanho SM/MD/LG/XL e badge overlay. |
|
|
340
|
+
| `DEx_Markdown` | `0.0.1` | Renderizador Markdown com suporte a tabelas e código. |
|
|
341
|
+
|
|
342
|
+
### cards
|
|
343
|
+
|
|
344
|
+
Superfícies reutilizáveis para métricas, entidades e conteúdo agrupado.
|
|
345
|
+
|
|
346
|
+
| Component | Version | Description |
|
|
347
|
+
|---|---:|---|
|
|
348
|
+
| `DEx_Card` | `0.0.1` | Superfície base para conteúdo agrupado. |
|
|
349
|
+
| `DEx_MetricCard` | `0.0.1` | Card de KPI com valor, ícone e variação. |
|
|
350
|
+
| `DEx_ContactCard` | `0.0.1` | Card de entidade com iniciais, metadados e rodapé. |
|
|
351
|
+
|
|
352
|
+
### buttons
|
|
353
|
+
|
|
354
|
+
Controles de ação: primário, secundário e somente ícone.
|
|
355
|
+
|
|
356
|
+
| Component | Version | Description |
|
|
357
|
+
|---|---:|---|
|
|
358
|
+
| `DEx_BtnPrimary` | `0.1.0` | Botão de ação primária. |
|
|
359
|
+
| `DEx_BtnGhost` | `0.0.1` | Botão de ação secundária com borda. |
|
|
360
|
+
| `DEx_BtnIcon` | `0.0.1` | Botão de ação somente com ícone. |
|
|
361
|
+
| `DEx_BtnFilled` | `0.0.1` | Botão preenchido de alta ênfase. |
|
|
362
|
+
| `DEx_BtnTonal` | `0.0.1` | Botão tonal de ênfase secundária. |
|
|
363
|
+
| `DEx_BtnText` | `0.0.1` | Botão textual de menor ênfase. |
|
|
364
|
+
| `DEx_BtnFAB` | `0.0.1` | Botão de ação flutuante para criação de registros. |
|
|
365
|
+
| `DEx_BtnSegmented` | `0.0.1` | Alternador de múltiplas opções mutuamente exclusivas. |
|
|
366
|
+
| `DEx_MenuBar` | `0.0.1` | Barra de menus horizontal com submenus. |
|
|
367
|
+
| `DEx_PopupMenu` | `0.0.1` | Menu de contexto acionado por ícone. |
|
|
368
|
+
|
|
369
|
+
### inputs
|
|
370
|
+
|
|
371
|
+
Controles de formulário e busca estilizados para o sistema visual DEx.
|
|
372
|
+
|
|
373
|
+
| Component | Version | Description |
|
|
374
|
+
|---|---:|---|
|
|
375
|
+
| `DEx_TextField` | `0.0.1` | Campo de texto estilizado. |
|
|
376
|
+
| `DEx_SearchField` | `0.0.1` | Campo de busca com ícone de lupa. |
|
|
377
|
+
| `DEx_Dropdown` | `0.0.1` | Seletor de opções estilizado. |
|
|
378
|
+
| `DEx_Checkbox` | `0.0.1` | Caixa de seleção booleana ou tristate estilizada. |
|
|
379
|
+
| `DEx_Switch` | `0.0.1` | Toggle switch para configurações binárias. |
|
|
380
|
+
| `DEx_Radio` | `0.0.1` | Opção de rádio e grupo para seleção mutuamente exclusiva. |
|
|
381
|
+
| `DEx_Slider` | `0.0.1` | Slider de valor único e de intervalo para entrada numérica. |
|
|
382
|
+
| `DEx_Chip` | `0.0.1` | Chip selecionável para filtros e multi-seleção. |
|
|
383
|
+
| `DEx_AutoComplete` | `0.0.1` | Campo de texto com dropdown de sugestões predefinidas. |
|
|
384
|
+
| `DEx_SearchBar` | `0.0.1` | Barra de pesquisa expansível com overlay de sugestões. |
|
|
385
|
+
| `DEx_DateField` | `0.0.1` | Campo de data estilizado com ícone e range opcional. |
|
|
386
|
+
| `DEx_TimeField` | `0.0.1` | Campo de horário com máscara hh:mm e range opcional. |
|
|
387
|
+
| `DEx_FilePicker` | `0.1.0` | Seletor de arquivo nativo com filtro de extensões. |
|
|
388
|
+
|
|
389
|
+
### data
|
|
390
|
+
|
|
391
|
+
Controles para tabelas, pipelines e visualizações de dados operacionais.
|
|
392
|
+
|
|
393
|
+
| Component | Version | Description |
|
|
394
|
+
|---|---:|---|
|
|
395
|
+
| `DEx_DataTable` | `0.0.1` | Tabela de dados estilizada. |
|
|
396
|
+
| `DEx_PipelineColumn` | `0.0.1` | Coluna de pipeline/Kanban por etapa. |
|
|
397
|
+
| `DEx_TreeView` | `0.0.1` | Árvore hierárquica com busca, expansão e seleção. |
|
|
398
|
+
| `DEx_ListTile` | `0.0.1` | Item de lista com título, subtítulo, leading e trailing. |
|
|
399
|
+
| `DEx_ExpansionTile` | `0.0.1` | Tile expansível que revela controles filhos. |
|
|
400
|
+
| `DEx_ExpansionPanel` | `0.0.1` | Painel acordeão agrupado em ExpansionPanelList. |
|
|
401
|
+
| `DEx_ListView` | `0.0.1` | Lista vertical com scroll e divisores automáticos. |
|
|
402
|
+
| `DEx_GridView` | `0.0.1` | Grade responsiva para cards e itens repetidos. |
|
|
403
|
+
|
|
404
|
+
### layout
|
|
405
|
+
|
|
406
|
+
Frame da aplicação, navegação e controles de estrutura de página.
|
|
407
|
+
|
|
408
|
+
| Component | Version | Description |
|
|
409
|
+
|---|---:|---|
|
|
410
|
+
| `DEx_AppShell` | `0.0.1` | Shell da aplicação com sidebar e área de conteúdo. |
|
|
411
|
+
| `DEx_Sidebar` | `0.0.1` | Sidebar de navegação vertical. |
|
|
412
|
+
| `DEx_Header` | `0.0.1` | Cabeçalho de página com busca e ações. |
|
|
413
|
+
| `DEx_NavItem` | `0.1.0` | Item de navegação com acento de estado ativo. |
|
|
414
|
+
| `DEx_Tabs` | `0.0.1` | Barra de abas horizontal com indicador em ACCENT. |
|
|
415
|
+
| `DEx_NavigationBar` | `0.0.1` | Barra de navegação inferior estilo mobile. |
|
|
416
|
+
| `DEx_NavigationRail` | `0.0.1` | Rail de navegação vertical compacto para desktop. |
|
|
417
|
+
| `DEx_NavigationDrawer` | `0.0.1` | Drawer lateral de navegação secundária. |
|
|
418
|
+
| `DEx_AppBar` | `0.0.1` | Barra superior de aplicação com título e ações. |
|
|
419
|
+
| `DEx_BottomAppBar` | `0.0.1` | Barra inferior com ações e suporte a FAB. |
|
|
420
|
+
| `DEx_Stack` | `0.0.1` | Stack com posicionamento absoluto, overlay e badge. |
|
|
421
|
+
| `DEx_ResponsiveRow` | `0.0.1` | Grade responsiva de 12 colunas com DEx_Col. |
|
|
422
|
+
| `DEx_GestureDetector` | `0.0.1` | Detector de tap, double-tap, long-press, hover e pan. |
|
|
423
|
+
| `DEx_Draggable` | `0.0.1` | Drag-and-drop: Draggable + DragTarget por grupo. |
|
|
424
|
+
| `DEx_AnimatedSwitcher` | `0.0.1` | Troca de conteúdo animada (FADE/SCALE/ROTATION). |
|
|
425
|
+
|
|
426
|
+
### feedback
|
|
427
|
+
|
|
428
|
+
Controles de feedback do usuário para estados transitórios.
|
|
429
|
+
|
|
430
|
+
| Component | Version | Description |
|
|
431
|
+
|---|---:|---|
|
|
432
|
+
| `DEx_Notify` | `0.0.1` | Notificação temporária tipo snackbar. |
|
|
433
|
+
| `DEx_AlertDialog` | `0.0.1` | Diálogo modal para confirmações e alertas. |
|
|
434
|
+
| `DEx_BottomSheet` | `0.0.1` | Painel deslizante que emerge da borda inferior. |
|
|
435
|
+
| `DEx_Banner` | `0.0.1` | Banner persistente abaixo do AppBar para avisos. |
|
|
436
|
+
| `DEx_Tooltip` | `0.0.1` | Dica contextual ao hover ou long-press. |
|
|
437
|
+
| `DEx_ProgressBar` | `0.0.1` | Barra de progresso horizontal determinada ou indeterminada. |
|
|
438
|
+
| `DEx_ProgressRing` | `0.0.1` | Indicador circular de progresso com label opcional. |
|
|
439
|
+
| `DEx_Shimmer` | `0.0.1` | Esqueletos de carregamento: ShimmerCard, ShimmerList. |
|
|
440
|
+
|
|
441
|
+
## Adding a Component
|
|
442
|
+
|
|
443
|
+
1. Create the component under the correct `components/<group>/` folder.
|
|
444
|
+
2. Add `COMPONENT_VERSION = "0.0.1"` for a new component.
|
|
445
|
+
3. Add a docstring to the public component factory or class.
|
|
446
|
+
4. Add metadata to `components/metadata.py`.
|
|
447
|
+
5. Create an isolated use case in `use_cases/`.
|
|
448
|
+
6. Run `python -m compileall components use_cases catalog`.
|
|
449
|
+
|
|
450
|
+
Skipping metadata is not harmless: the component will exist in code but disappear from the catalog.
|