SaaS-FrameWork 0.1.2__tar.gz → 0.1.4__tar.gz

{saas_framework-0.1.2 → saas_framework-0.1.4}/MANIFEST.in

@@ -10,7 +10,7 @@ prune build
 prune catalog
 prune *.egg-info
 prune dist
-prune docs
+prune Diretrizes
 prune tests
 prune use_cases
 exclude files.zip

saas_framework-0.1.4/PKG-INFO

@@ -0,0 +1,116 @@
+Metadata-Version: 2.4
+Name: SaaS-FrameWork
+Version: 0.1.4
+Summary: SaaS-FrameWork - sistema de componentes reutilizaveis para apps SaaS construido com Python e Flet
+Author-email: Almir Duarte <almir.jg@gmail.com>
+License-Expression: MIT
+Project-URL: Repository, https://github.com/DEx-SaaS/FrameWork
+Keywords: flet,saas,framework,ui,components,design-system
+Classifier: Development Status :: 1 - Planning
+Classifier: Intended Audience :: Developers
+Classifier: Programming Language :: Python :: 3.13
+Classifier: Topic :: Software Development :: User Interfaces
+Requires-Python: >=3.13
+Description-Content-Type: text/markdown
+Requires-Dist: flet==0.84.0
+Requires-Dist: flet-charts==0.84.0
+Provides-Extra: web
+Requires-Dist: flet-web==0.84.0; extra == "web"
+Provides-Extra: dev
+Requires-Dist: flet==0.84.0; extra == "dev"
+Requires-Dist: pytest<10,>=9.1; extra == "dev"
+Requires-Dist: build<2,>=1.3; extra == "dev"
+Requires-Dist: twine<7,>=6.2; extra == "dev"
+Provides-Extra: visual
+Requires-Dist: playwright<2,>=1.40; extra == "visual"
+
+# SaaS-FrameWork
+
+Reusable SaaS UI components for [Flet](https://flet.dev): a versioned design system with
+**70 catalogued components** — buttons, inputs, navigation, data tables and tree views,
+overlays and dialogs, feedback, media and responsive layout — plus accessible color themes
+and a navigable component catalog.
+
+## Install
+
+```bash
+pip install SaaS-FrameWork
+```
+
+For web deployments, install the web extra:
+
+```bash
+pip install "SaaS-FrameWork[web]"
+```
+
+## Quickstart
+
+```python
+import flet as ft
+from components import DEx_BtnPrimary, DEx_MetricCard, DEx_Notify, DEx_TextField
+
+
+def main(page: ft.Page) -> None:
+    page.title = "Hello SaaS-FrameWork"
+    name = DEx_TextField(label="Your name", hint="Type and press the button")
+    page.add(
+        DEx_MetricCard(label="Active users", value="1,024", delta="+12%"),
+        name,
+        DEx_BtnPrimary("Greet", on_click=lambda e: DEx_Notify(page, f"Hello, {name.value}!")),
+    )
+
+
+ft.app(main)
+```
+
+Save as `hello.py` and run:
+
+```bash
+python hello.py
+```
+
+Every public component is importable straight from `components`
+(`from components import DEx_DataTable, DEx_AppShell, ...`).
+
+## Compatibility
+
+| Requirement | Version |
+|---|---|
+| Python | `>= 3.13` |
+| Flet | `== 0.84.0` (pinned) |
+
+The Flet dependency is intentionally **pinned**: Flet's API still moves between releases, so
+upgrades only land here after the project's upgrade policy revalidates all 70 use cases
+against the candidate version. Installing this package therefore also pins your app's Flet
+version.
+
+## Component catalog
+
+Browse every component, its use case, parameters and source in the live catalog:
+
+- **Online:** https://saas-framework-catalog.onrender.com
+- **Local (from the repository):** `flet run catalog/catalog.py`
+
+The catalog has global search, maturity filters and a responsive layout, and is audited for
+accessibility (WCAG AA contrast, keyboard navigation).
+
+## Versioning and maturity
+
+The project is **pre-1.0**: APIs may still change between minor releases. Each component
+declares its own `COMPONENT_VERSION` and the catalog groups them into maturity bands —
+Experimental (`0.0.x`), Evolving (`0.1.x+`) and Stable (`1.x+`). Every component change is
+required (and CI-enforced) to bump the component version. Release history lives in
+[CHANGELOG.md](CHANGELOG.md).
+
+## Feedback
+
+Bug reports, questions and suggestions: https://github.com/DEx-SaaS/FrameWork/issues
+
+## Development
+
+Contributor documentation — folder structure, naming conventions, versioning rules, test
+suite and the component contract — lives in [CONTRIBUTING.md](CONTRIBUTING.md).
+
+## License
+
+MIT.

saas_framework-0.1.4/README.md

@@ -0,0 +1,90 @@
+# SaaS-FrameWork
+
+Reusable SaaS UI components for [Flet](https://flet.dev): a versioned design system with
+**70 catalogued components** — buttons, inputs, navigation, data tables and tree views,
+overlays and dialogs, feedback, media and responsive layout — plus accessible color themes
+and a navigable component catalog.
+
+## Install
+
+```bash
+pip install SaaS-FrameWork
+```
+
+For web deployments, install the web extra:
+
+```bash
+pip install "SaaS-FrameWork[web]"
+```
+
+## Quickstart
+
+```python
+import flet as ft
+from components import DEx_BtnPrimary, DEx_MetricCard, DEx_Notify, DEx_TextField
+
+
+def main(page: ft.Page) -> None:
+    page.title = "Hello SaaS-FrameWork"
+    name = DEx_TextField(label="Your name", hint="Type and press the button")
+    page.add(
+        DEx_MetricCard(label="Active users", value="1,024", delta="+12%"),
+        name,
+        DEx_BtnPrimary("Greet", on_click=lambda e: DEx_Notify(page, f"Hello, {name.value}!")),
+    )
+
+
+ft.app(main)
+```
+
+Save as `hello.py` and run:
+
+```bash
+python hello.py
+```
+
+Every public component is importable straight from `components`
+(`from components import DEx_DataTable, DEx_AppShell, ...`).
+
+## Compatibility
+
+| Requirement | Version |
+|---|---|
+| Python | `>= 3.13` |
+| Flet | `== 0.84.0` (pinned) |
+
+The Flet dependency is intentionally **pinned**: Flet's API still moves between releases, so
+upgrades only land here after the project's upgrade policy revalidates all 70 use cases
+against the candidate version. Installing this package therefore also pins your app's Flet
+version.
+
+## Component catalog
+
+Browse every component, its use case, parameters and source in the live catalog:
+
+- **Online:** https://saas-framework-catalog.onrender.com
+- **Local (from the repository):** `flet run catalog/catalog.py`
+
+The catalog has global search, maturity filters and a responsive layout, and is audited for
+accessibility (WCAG AA contrast, keyboard navigation).
+
+## Versioning and maturity
+
+The project is **pre-1.0**: APIs may still change between minor releases. Each component
+declares its own `COMPONENT_VERSION` and the catalog groups them into maturity bands —
+Experimental (`0.0.x`), Evolving (`0.1.x+`) and Stable (`1.x+`). Every component change is
+required (and CI-enforced) to bump the component version. Release history lives in
+[CHANGELOG.md](CHANGELOG.md).
+
+## Feedback
+
+Bug reports, questions and suggestions: https://github.com/DEx-SaaS/FrameWork/issues
+
+## Development
+
+Contributor documentation — folder structure, naming conventions, versioning rules, test
+suite and the component contract — lives in [CONTRIBUTING.md](CONTRIBUTING.md).
+
+## License
+
+MIT.

{saas_framework-0.1.2 → saas_framework-0.1.4}/SaaS_FrameWork.egg-info/SOURCES.txt

@@ -20,6 +20,10 @@ components/cards/DEx_Card.py
 components/cards/DEx_ContactCard.py
 components/cards/DEx_MetricCard.py
 components/cards/__init__.py
+components/charts/DEx_BarChart.py
+components/charts/DEx_LineChart.py
+components/charts/DEx_PieChart.py
+components/charts/__init__.py
 components/data/DEx_DataTable.py
 components/data/DEx_ExpansionPanel.py
 components/data/DEx_ExpansionTile.py
@@ -81,4 +85,5 @@ components/primitives/DEx_StatusDot.py
 components/primitives/__init__.py
 components/theme/DEx_ColorThemes.py
 components/theme/DEx_Theme.py
-components/theme/__init__.py
+components/theme/__init__.py
+components/theme/platform_variant.py

{saas_framework-0.1.2 → saas_framework-0.1.4}/components/__init__.py

@@ -77,6 +77,10 @@ from components.feedback.DEx_ProgressBar import DEx_ProgressBar
 from components.feedback.DEx_ProgressRing import DEx_ProgressRing
 from components.feedback.DEx_Shimmer import DEx_ShimmerCard, DEx_ShimmerListItem, DEx_ShimmerList
 
+from components.charts.DEx_LineChart import DEx_LineChart
+from components.charts.DEx_BarChart import DEx_BarChart
+from components.charts.DEx_PieChart import DEx_PieChart
+
 __version__ = "0.1.1"
 
 __all__ = [
@@ -120,6 +124,8 @@ __all__ = [
     "DEx_Notify", "DEx_AlertDialog", "DEx_BottomSheet", "DEx_Banner",
     "DEx_Tooltip", "DEx_ProgressBar", "DEx_ProgressRing",
     "DEx_ShimmerCard", "DEx_ShimmerListItem", "DEx_ShimmerList",
+    # charts
+    "DEx_LineChart", "DEx_BarChart", "DEx_PieChart",
     # meta
     "__version__",
 ]

{saas_framework-0.1.2 → saas_framework-0.1.4}/components/buttons/DEx_BtnFAB.py

@@ -1,7 +1,7 @@
 import flet as ft
 from components.theme.DEx_Theme import Colors, Spacing
 
-COMPONENT_VERSION = "0.0.1"
+COMPONENT_VERSION = "0.0.2"
 
 
 def DEx_BtnFAB(
@@ -13,11 +13,13 @@ def DEx_BtnFAB(
     """Floating action button for the primary creation or positive action on a screen.
 
     Pass label for extended FAB; omit for compact circular form.
+    Rótulo e ícone em ``ACCENT_ON`` (token semântico "sobre ACCENT") —
+    débito técnico 12, S12/atv11.
     """
     if label:
         return ft.FloatingActionButton(
             content=ft.Row(
-                [ft.Icon(icon, size=18, color=Colors.TEXT_PRIMARY), ft.Text(label, size=14, color=Colors.TEXT_PRIMARY)],
+                [ft.Icon(icon, size=18, color=Colors.ACCENT_ON), ft.Text(label, size=14, color=Colors.ACCENT_ON)],
                 spacing=8,
                 tight=True,
             ),
@@ -31,7 +33,7 @@ def DEx_BtnFAB(
         on_click=on_click,
         mini=mini,
         bgcolor=Colors.ACCENT,
-        foreground_color=Colors.TEXT_PRIMARY,
+        foreground_color=Colors.ACCENT_ON,
         hover_color=Colors.ACCENT_DARK,
         shape=ft.RoundedRectangleBorder(radius=28),
     )

saas_framework-0.1.4/components/buttons/DEx_BtnFilled.py

@@ -0,0 +1,34 @@
+import flet as ft
+from components.theme.platform_variant import adaptive_kwargs, is_cupertino
+from components.theme.DEx_Theme import Colors, Spacing
+
+COMPONENT_VERSION = "0.1.0"
+
+
+def DEx_BtnFilled(label: str, on_click=None, icon=None, platform: str | None = None):
+    """Primary filled button — highest emphasis action in a view.
+
+    Rótulo em ``ACCENT_ON`` (token semântico "sobre ACCENT"), mesma higiene
+    do DEx_BtnPrimary — débito técnico 12, S12/atv11."""
+    if is_cupertino(platform):
+        return ft.CupertinoFilledButton(
+            content=label,
+            icon=icon,
+            on_click=on_click,
+            bgcolor=Colors.ACCENT,
+            color=Colors.ACCENT_ON,
+            border_radius=Spacing.BUTTON_BORDER_RADIUS,
+        )
+    return ft.FilledButton(
+        **adaptive_kwargs(platform),
+        content=label,
+        icon=icon,
+        on_click=on_click,
+        style=ft.ButtonStyle(
+            bgcolor=Colors.ACCENT,
+            color=Colors.ACCENT_ON,
+            overlay_color=Colors.ACCENT_DARK,
+            shape=ft.RoundedRectangleBorder(radius=Spacing.BUTTON_BORDER_RADIUS),
+            padding=ft.Padding.symmetric(horizontal=Spacing.MD, vertical=Spacing.SM + 2),
+        ),
+    )

{saas_framework-0.1.2 → saas_framework-0.1.4}/components/buttons/DEx_BtnGhost.py

@@ -1,12 +1,23 @@
 import flet as ft
+from components.theme.platform_variant import adaptive_kwargs, is_cupertino
 from components.theme.DEx_Theme import Colors, Spacing
 
-COMPONENT_VERSION = "0.1.0"
+COMPONENT_VERSION = "0.2.0"
 
 
-def DEx_BtnGhost(label: str, on_click=None, icon=None) -> ft.Button:
+def DEx_BtnGhost(label: str, on_click=None, icon=None, platform: str | None = None):
     """Create the versioned secondary outlined button for lower-emphasis actions."""
+    if is_cupertino(platform):
+        return ft.CupertinoButton(
+            content=label,
+            icon=icon,
+            on_click=on_click,
+            bgcolor="transparent",
+            color=Colors.TEXT_PRIMARY,
+            border_radius=Spacing.BUTTON_BORDER_RADIUS,
+        )
     return ft.Button(
+        **adaptive_kwargs(platform),
         content=label,
         icon=icon,
         on_click=on_click,

saas_framework-0.1.4/components/buttons/DEx_BtnPrimary.py

@@ -0,0 +1,41 @@
+import flet as ft
+from components.theme.platform_variant import adaptive_kwargs, is_cupertino
+from components.theme.DEx_Theme import Colors, Spacing
+
+COMPONENT_VERSION = "0.2.0"
+
+
+def DEx_BtnPrimary(label: str, on_click=None, icon=None, platform: str | None = None):
+    """Create the versioned primary action button for main user commands.
+
+    Rótulo em ``ACCENT_ON`` — o token semântico "sobre ACCENT" (5.17:1 no
+    tema default e AA por construção nos presets, que trocam o rótulo para
+    escuro quando o accent do preset é claro). ``TEXT_PRIMARY`` passava no
+    tema default mas não acompanha os presets (débito técnico 12, S12/atv11).
+
+    ``platform`` aceita ``"material"`` (padrão), ``"ios"`` (contraparte
+    Cupertino) e ``"auto"`` (o Flet escolhe em runtime) — ver
+    ``components/theme/platform_variant.py``."""
+    if is_cupertino(platform):
+        return ft.CupertinoFilledButton(
+            content=label,
+            icon=icon,
+            on_click=on_click,
+            bgcolor=Colors.ACCENT,
+            color=Colors.ACCENT_ON,
+            border_radius=Spacing.BUTTON_BORDER_RADIUS,
+        )
+    return ft.Button(
+        **adaptive_kwargs(platform),
+        content=label,
+        icon=icon,
+        on_click=on_click,
+        bgcolor=Colors.ACCENT,
+        color=Colors.ACCENT_ON,
+        elevation=1,
+        style=ft.ButtonStyle(
+            overlay_color=Colors.ACCENT_DARK,
+            shape=ft.RoundedRectangleBorder(radius=Spacing.BUTTON_BORDER_RADIUS),
+            padding=ft.Padding.symmetric(horizontal=Spacing.MD, vertical=Spacing.SM + 2),
+        ),
+    )

{saas_framework-0.1.2 → saas_framework-0.1.4}/components/buttons/DEx_BtnSegmented.py

@@ -1,7 +1,7 @@
 import flet as ft
 from components.theme.DEx_Theme import Colors, Spacing
 
-COMPONENT_VERSION = "0.0.1"
+COMPONENT_VERSION = "0.0.2"
 
 
 def DEx_BtnSegmented(
@@ -14,6 +14,8 @@ def DEx_BtnSegmented(
     """Multi-option toggle control for mutually exclusive or multi-select choices.
 
     Each entry in segments: {"value": str, "label": str, "icon": str | None}
+    Rótulo do segmento selecionado em ``ACCENT_ON`` (token semântico
+    "sobre ACCENT") — débito técnico 12, S12/atv11.
     """
     _selected = list(selected) if selected else [segments[0]["value"]]
     return ft.SegmentedButton(
@@ -35,7 +37,7 @@ def DEx_BtnSegmented(
                 ft.ControlState.DEFAULT: Colors.BG_ELEVATED,
             },
             color={
-                ft.ControlState.SELECTED: Colors.TEXT_PRIMARY,
+                ft.ControlState.SELECTED: Colors.ACCENT_ON,
                 ft.ControlState.DEFAULT: Colors.TEXT_SECONDARY,
             },
             side=ft.BorderSide(1, Colors.BORDER),

saas_framework-0.1.4/components/buttons/DEx_BtnText.py

@@ -0,0 +1,36 @@
+import flet as ft
+from components.theme.platform_variant import adaptive_kwargs, is_cupertino
+from components.theme.DEx_Theme import Colors, Spacing
+
+COMPONENT_VERSION = "0.2.0"
+
+
+def DEx_BtnText(label: str, on_click=None, icon=None, platform: str | None = None):
+    """Lowest-emphasis action button: no border and no background fill.
+
+    Rótulo em ``ACCENT_TEXT`` (violeta AA para texto pequeno, >= 4.5:1 nos
+    três fundos) — ``ACCENT`` é token de UI e media 3.44:1 como texto
+    (débito técnico 12, S12/atv11)."""
+    if is_cupertino(platform):
+        return ft.CupertinoButton(
+            content=label,
+            icon=icon,
+            on_click=on_click,
+            bgcolor="transparent",
+            color=Colors.ACCENT_TEXT,
+        )
+    return ft.Button(
+        **adaptive_kwargs(platform),
+        content=label,
+        icon=icon,
+        on_click=on_click,
+        bgcolor="transparent",
+        color=Colors.ACCENT_TEXT,
+        elevation=0,
+        style=ft.ButtonStyle(
+            color=Colors.ACCENT_TEXT,
+            overlay_color=Colors.BG_ELEVATED,
+            shape=ft.RoundedRectangleBorder(radius=Spacing.BUTTON_BORDER_RADIUS),
+            padding=ft.Padding.symmetric(horizontal=Spacing.SM, vertical=Spacing.SM + 2),
+        ),
+    )

{saas_framework-0.1.2 → saas_framework-0.1.4}/components/buttons/DEx_BtnTonal.py

@@ -1,18 +1,21 @@
 import flet as ft
 from components.theme.DEx_Theme import Colors, Spacing
 
-COMPONENT_VERSION = "0.0.1"
+COMPONENT_VERSION = "0.0.2"
 
 
 def DEx_BtnTonal(label: str, on_click=None, icon=None) -> ft.FilledTonalButton:
-    """Secondary filled button with muted emphasis — between outlined and filled."""
+    """Secondary filled button with muted emphasis — between outlined and filled.
+
+    Rótulo em ``ACCENT_TEXT`` (>= 4.76:1 sobre BG_ELEVATED) — ``ACCENT``
+    media 3.13:1 sobre o fundo elevado (débito técnico 12, S12/atv11)."""
     return ft.FilledTonalButton(
         content=label,
         icon=icon,
         on_click=on_click,
         style=ft.ButtonStyle(
             bgcolor=Colors.BG_ELEVATED,
-            color=Colors.ACCENT,
+            color=Colors.ACCENT_TEXT,
             overlay_color=Colors.ACCENT_DARK,
             shape=ft.RoundedRectangleBorder(radius=Spacing.BUTTON_BORDER_RADIUS),
             padding=ft.Padding.symmetric(horizontal=Spacing.MD, vertical=Spacing.SM + 2),

{saas_framework-0.1.2 → saas_framework-0.1.4}/components/cards/DEx_ContactCard.py

@@ -4,7 +4,7 @@ from components.cards.DEx_Card import DEx_Card
 from components.primitives.DEx_Badge import DEx_Badge
 from components.primitives.DEx_Divider import DEx_Divider
 
-COMPONENT_VERSION = "0.0.1"
+COMPONENT_VERSION = "0.0.2"
 
 
 def DEx_ContactCard(
@@ -15,13 +15,19 @@ def DEx_ContactCard(
     tag: str = None,
     value: str = None,
 ) -> ft.Container:
-    """Create the versioned contact/entity card with avatar and optional footer."""
+    """Create the versioned contact/entity card with avatar and optional footer.
+
+    S12/atv11: iniciais e tag em ``ACCENT_TEXT`` (>= 4.69:1 sobre o fill
+    translúcido composto com o fundo do card, débito técnico 12); os fills
+    com sufixo hex ``22``/``33`` viravam AARRGGBB no Flutter e pintavam
+    esverdeados (BUG5) — agora usam ``ft.Colors.with_opacity``.
+    """
     initials = "".join(p[0].upper() for p in name.split()[:2])
 
     avatar = ft.Container(
-        content=ft.Text(initials, size=14, weight=ft.FontWeight.W_700, color=Colors.ACCENT),
+        content=ft.Text(initials, size=14, weight=ft.FontWeight.W_700, color=Colors.ACCENT_TEXT),
         width=42, height=42,
-        bgcolor=f"{Colors.ACCENT}22",
+        bgcolor=ft.Colors.with_opacity(0.13, Colors.ACCENT),
         border_radius=21,
         alignment=ft.Alignment(0, 0),
     )
@@ -35,7 +41,11 @@ def DEx_ContactCard(
     footer_controls = []
     if tag:
         footer_controls.append(
-            DEx_Badge(tag, color=f"{Colors.ACCENT}33", text_color=Colors.ACCENT)
+            DEx_Badge(
+                tag,
+                color=ft.Colors.with_opacity(0.13, Colors.ACCENT),
+                text_color=Colors.ACCENT_TEXT,
+            )
         )
     if value:
         footer_controls.append(

saas_framework-0.1.4/components/charts/DEx_BarChart.py

@@ -0,0 +1,101 @@
+"""DEx_BarChart — comparação por categoria, com os tokens do tema.
+
+Construído sobre ``flet_charts`` (decisão D5). Aceita uma série (barras
+simples) ou várias (barras agrupadas por categoria), com legenda opcional.
+"""
+from __future__ import annotations
+
+import flet as ft
+import flet_charts as fc
+
+from components.charts.DEx_LineChart import series_color
+from components.theme.DEx_Theme import Colors, Spacing
+
+COMPONENT_VERSION = "0.0.1"
+
+
+def _legenda(nomes: list[str]) -> ft.Row:
+    itens: list[ft.Control] = []
+    for i, nome in enumerate(nomes):
+        itens.append(
+            ft.Row(
+                [
+                    ft.Container(width=10, height=10, bgcolor=series_color(i), border_radius=2),
+                    ft.Text(nome, size=11, color=Colors.TEXT_SECONDARY),
+                ],
+                spacing=6,
+                tight=True,
+            )
+        )
+    return ft.Row(itens, spacing=Spacing.MD, wrap=True)
+
+
+def DEx_BarChart(
+    categories: list[str],
+    series: list[dict],
+    height: int = 260,
+    show_legend: bool = True,
+    show_grid: bool = True,
+    bar_width: int = 16,
+    horizontal: bool = False,
+) -> ft.Column:
+    """Gráfico de barras agrupadas por categoria.
+
+    Args:
+        categories: rótulos do eixo de categorias (uma entrada por grupo).
+        series: lista de séries. Cada série é um dicionário com ``name`` (str)
+            e ``values`` (lista de números, alinhada a ``categories``). Aceita
+            ``color`` para fixar a cor.
+        height: altura do gráfico em pixels.
+        show_legend: exibe a legenda de séries abaixo do gráfico.
+        show_grid: exibe a grade horizontal.
+        bar_width: largura de cada barra em pixels.
+        horizontal: ainda não suportado pelo backend; mantido para
+            compatibilidade futura de assinatura e ignorado hoje.
+    """
+    nomes = [s.get("name", f"Série {i + 1}") for i, s in enumerate(series)]
+
+    grupos: list[fc.BarChartGroup] = []
+    for indice_categoria in range(len(categories)):
+        barras: list[fc.BarChartRod] = []
+        for i, serie in enumerate(series):
+            valores = serie.get("values", [])
+            if indice_categoria >= len(valores):
+                continue
+            barras.append(
+                fc.BarChartRod(
+                    to_y=valores[indice_categoria],
+                    width=bar_width,
+                    color=serie.get("color") or series_color(i),
+                    border_radius=4,
+                )
+            )
+        grupos.append(fc.BarChartGroup(x=indice_categoria, rods=barras))
+
+    eixo_x = fc.ChartAxis(
+        labels=[
+            fc.ChartAxisLabel(
+                value=i,
+                label=ft.Text(rotulo, size=10, color=Colors.TEXT_SECONDARY),
+            )
+            for i, rotulo in enumerate(categories)
+        ],
+        label_size=28,
+    )
+
+    grafico = fc.BarChart(
+        groups=grupos,
+        bottom_axis=eixo_x,
+        left_axis=fc.ChartAxis(label_size=40),
+        border=ft.Border.all(1, Colors.BORDER),
+        horizontal_grid_lines=(
+            fc.ChartGridLines(color=Colors.BORDER, width=1) if show_grid else None
+        ),
+        tooltip=fc.BarChartTooltip(bgcolor=Colors.BG_ELEVATED),
+        expand=True,
+    )
+
+    conteudo: list[ft.Control] = [ft.Container(content=grafico, height=height)]
+    if show_legend and nomes:
+        conteudo.append(_legenda(nomes))
+    return ft.Column(conteudo, spacing=Spacing.SM, tight=True)