SaaS-FrameWork 0.1.1__py3-none-any.whl

components/layout/DEx_AnimatedSwitcher.py

@@ -0,0 +1,43 @@
+import flet as ft
+from components.theme.DEx_Theme import Colors, Spacing
+
+COMPONENT_VERSION = "0.0.2"
+
+
+def DEx_AnimatedSwitcher(
+    content: ft.Control,
+    duration: int = 350,
+    reverse_duration: int | None = None,
+    switch_in_curve: ft.AnimationCurve = ft.AnimationCurve.EASE_IN_OUT,
+    switch_out_curve: ft.AnimationCurve = ft.AnimationCurve.EASE_IN_OUT,
+    transition: ft.AnimatedSwitcherTransition = ft.AnimatedSwitcherTransition.SCALE,
+) -> ft.AnimatedSwitcher:
+    """Troca de conteúdo com animação. Altere .content + chame update() para animar."""
+    return ft.AnimatedSwitcher(
+        content=content,
+        duration=duration,
+        reverse_duration=reverse_duration or duration,
+        switch_in_curve=switch_in_curve,
+        switch_out_curve=switch_out_curve,
+        transition=transition,
+    )
+
+
+def DEx_AnimatedContainer(
+    content: ft.Control,
+    width: int | float | None = None,
+    height: int | float | None = None,
+    bgcolor: str | None = None,
+    border_radius: int = 0,
+    duration: int = 300,
+    curve: ft.AnimationCurve = ft.AnimationCurve.EASE_IN_OUT,
+) -> ft.Container:
+    """Container com transições animadas de tamanho, cor e geometria."""
+    return ft.Container(
+        content=content,
+        width=width,
+        height=height,
+        bgcolor=bgcolor,
+        border_radius=border_radius,
+        animate=ft.Animation(duration, curve),
+    )

components/layout/DEx_AppBar.py

@@ -0,0 +1,48 @@
+import flet as ft
+from components.theme.DEx_Theme import Colors, Spacing
+
+COMPONENT_VERSION = "0.0.1"
+
+
+def DEx_AppBar(
+    title: str,
+    leading: ft.Control | None = None,
+    actions: list[ft.Control] | None = None,
+    center_title: bool = False,
+    subtitle: str = "",
+) -> ft.AppBar:
+    """Top application bar with title, optional leading widget, and action buttons."""
+    title_col = ft.Column(
+        [
+            ft.Text(title, size=15, weight=ft.FontWeight.W_600, color=Colors.TEXT_PRIMARY),
+            ft.Text(subtitle, size=11, color=Colors.TEXT_SECONDARY) if subtitle else ft.Container(),
+        ],
+        spacing=1,
+        tight=True,
+    )
+    return ft.AppBar(
+        title=title_col,
+        leading=leading,
+        actions=actions or [],
+        center_title=center_title,
+        bgcolor=Colors.BG_SURFACE,
+        color=Colors.TEXT_PRIMARY,
+        elevation=0,
+        shadow_color=ft.Colors.TRANSPARENT,
+        toolbar_height=Spacing.HEADER_HEIGHT,
+    )
+
+
+def DEx_BottomAppBar(
+    actions: list[ft.Control],
+    fab: ft.Control | None = None,
+) -> ft.BottomAppBar:
+    """Bottom app bar with action icons and optional FAB notch."""
+    return ft.BottomAppBar(
+        content=ft.Row(actions, spacing=Spacing.XS),
+        bgcolor=Colors.BG_SURFACE,
+        elevation=0,
+        shadow_color=ft.Colors.TRANSPARENT,
+        padding=ft.Padding.symmetric(horizontal=Spacing.SM, vertical=Spacing.XS),
+        notch_margin=Spacing.SM,
+    )

components/layout/DEx_AppShell.py

@@ -0,0 +1,80 @@
+import flet as ft
+from components.theme.DEx_Theme import Colors, Spacing
+from components.layout.DEx_Sidebar import DEx_Sidebar
+from components.layout.DEx_Header import DEx_Header
+
+COMPONENT_VERSION = "0.0.1"
+
+
+class DEx_AppShell(ft.Row):
+    """Versioned application shell with sidebar, header, and content host."""
+
+    def __init__(
+        self,
+        page: ft.Page,
+        title: str = "",
+        subtitle: str = "",
+        header_actions: list[ft.Control] | None = None,
+    ):
+        self._page_ref = page
+        self.title = title
+        self.subtitle = subtitle
+        self.header_actions = header_actions or []
+        self._content = ft.Container(expand=True)
+        self._route = "/dashboard"
+
+        page.bgcolor = Colors.BG_DEEP
+        page.padding = 0
+        page.spacing = 0
+
+        super().__init__(
+            controls=self._build_controls(),
+            spacing=0,
+            expand=True,
+        )
+
+    def set_content(self, control: ft.Control, title: str = None, subtitle: str = None):
+        if title:
+            self.title = title
+        if subtitle:
+            self.subtitle = subtitle
+        self._content = ft.Container(
+            content=ft.Column(
+                [ft.Container(content=control, padding=ft.Padding.all(Spacing.LG))],
+                spacing=0,
+                expand=True,
+                horizontal_alignment=ft.CrossAxisAlignment.START,
+            ),
+            expand=True,
+            bgcolor=Colors.BG_DEEP,
+        )
+        self.controls = self._build_controls()
+        try:
+            self.update()
+        except RuntimeError:
+            pass
+
+    def _on_navigate(self, route: str):
+        self._route = route
+        self.controls = self._build_controls()
+        self.update()
+
+    def _build_controls(self) -> list[ft.Control]:
+        sidebar = DEx_Sidebar(current_route=self._route, on_navigate=self._on_navigate)
+        header = DEx_Header(self.title, self.subtitle, actions=self.header_actions)
+
+        main_area = ft.Column(
+            [
+                ft.Row([header], spacing=0, expand=True),
+                ft.Container(
+                    content=self._content,
+                    expand=True,
+                    clip_behavior=ft.ClipBehavior.HARD_EDGE,
+                ),
+            ],
+            spacing=0,
+            expand=True,
+            alignment=ft.MainAxisAlignment.START,
+        )
+
+        return [sidebar, main_area]

components/layout/DEx_Draggable.py

@@ -0,0 +1,67 @@
+import flet as ft
+from components.theme.DEx_Theme import Colors, Spacing
+
+COMPONENT_VERSION = "0.0.1"
+
+
+def DEx_Draggable(
+    content: ft.Control,
+    group: str = "default",
+    data=None,
+    content_when_dragging: ft.Control | None = None,
+    content_feedback: ft.Control | None = None,
+) -> ft.Draggable:
+    """Controle arrastável. Combine com DEx_DragTarget do mesmo grupo."""
+    placeholder = content_when_dragging or ft.Container(
+        width=60,
+        height=60,
+        border=ft.Border.all(1, Colors.BORDER),
+        border_radius=Spacing.CARD_BORDER_RADIUS,
+        bgcolor=Colors.BG_ELEVATED,
+    )
+    feedback = content_feedback or ft.Container(
+        content=content,
+        opacity=0.7,
+    )
+    return ft.Draggable(
+        group=group,
+        content=content,
+        content_when_dragging=placeholder,
+        content_feedback=feedback,
+        data=data,
+    )
+
+
+def DEx_DragTarget(
+    group: str = "default",
+    on_accept=None,
+    on_will_accept=None,
+    on_leave=None,
+    content: ft.Control | None = None,
+    content_when_empty: ft.Control | None = None,
+) -> ft.DragTarget:
+    """Alvo de soltura para DEx_Draggable do mesmo grupo."""
+    body = content or content_when_empty or ft.Container(
+        width=120,
+        height=80,
+        border=ft.Border.all(1, Colors.BORDER),
+        border_radius=Spacing.CARD_BORDER_RADIUS,
+        bgcolor=Colors.BG_SURFACE,
+        content=ft.Column(
+            [
+                ft.Icon(ft.Icons.UPLOAD_ROUNDED, size=20, color=Colors.TEXT_MUTED),
+                ft.Text("Solte aqui", size=11, color=Colors.TEXT_MUTED),
+            ],
+            horizontal_alignment=ft.CrossAxisAlignment.CENTER,
+            alignment=ft.MainAxisAlignment.CENTER,
+            spacing=4,
+            tight=True,
+        ),
+    )
+    return ft.DragTarget(
+        group=group,
+        content=body,
+        on_accept=on_accept,
+        on_will_accept=on_will_accept,
+        on_leave=on_leave,
+    )

components/layout/DEx_GestureDetector.py

@@ -0,0 +1,52 @@
+import flet as ft
+from components.theme.DEx_Theme import Colors
+
+COMPONENT_VERSION = "0.0.1"
+
+
+def DEx_GestureDetector(
+    content: ft.Control,
+    on_tap=None,
+    on_double_tap=None,
+    on_long_press=None,
+    on_hover=None,
+    on_enter=None,
+    on_exit=None,
+    on_pan_update=None,
+    mouse_cursor: ft.MouseCursor = ft.MouseCursor.CLICK,
+) -> ft.GestureDetector:
+    """Detector de gestos: tap, double-tap, long-press, hover, enter/exit e pan."""
+    return ft.GestureDetector(
+        content=content,
+        on_tap=on_tap,
+        on_double_tap=on_double_tap,
+        on_long_press_start=on_long_press,
+        on_hover=on_hover,
+        on_enter=on_enter,
+        on_exit=on_exit,
+        on_pan_update=on_pan_update,
+        mouse_cursor=mouse_cursor,
+    )
+
+
+def DEx_Hoverable(
+    content_normal: ft.Control,
+    content_hover: ft.Control,
+) -> ft.GestureDetector:
+    """Alterna entre dois controles ao entrar/sair com o mouse."""
+    container_ref: ft.Ref[ft.Container] = ft.Ref()
+
+    def _toggle(show_hover: bool):
+        if container_ref.current:
+            container_ref.current.content = content_hover if show_hover else content_normal
+            try:
+                container_ref.current.update()
+            except RuntimeError:
+                pass
+
+    return ft.GestureDetector(
+        content=ft.Container(ref=container_ref, content=content_normal),
+        on_enter=lambda e: _toggle(True),
+        on_exit=lambda e: _toggle(False),
+        mouse_cursor=ft.MouseCursor.CLICK,
+    )

components/layout/DEx_Header.py

@@ -0,0 +1,57 @@
+import flet as ft
+from components.theme.DEx_Theme import Colors, Spacing
+
+COMPONENT_VERSION = "0.0.1"
+
+
+class DEx_Header(ft.Container):
+    """Versioned page header with title, subtitle, search, and actions."""
+
+    def __init__(self, title: str, subtitle: str = "", actions: list[ft.Control] | None = None):
+        self.title = title
+        self.subtitle = subtitle
+        self.actions = actions or []
+        super().__init__(
+            content=self._build_content(),
+            height=Spacing.HEADER_HEIGHT,
+            bgcolor=Colors.BG_DEEP,
+            border=ft.Border.only(bottom=ft.BorderSide(1, Colors.BORDER)),
+            padding=ft.Padding.symmetric(horizontal=Spacing.LG),
+        )
+
+    def _build_content(self) -> ft.Row:
+        title_block = ft.Column(
+            [
+                ft.Text(self.title, size=20, weight=ft.FontWeight.W_700, color=Colors.TEXT_PRIMARY),
+                ft.Text(self.subtitle, size=12, color=Colors.TEXT_SECONDARY) if self.subtitle else ft.Container(),
+            ],
+            spacing=2, tight=True,
+        )
+
+        search = ft.TextField(
+            hint_text="Buscar...",
+            prefix_icon=ft.Icons.SEARCH,
+            border_color=Colors.BORDER,
+            focused_border_color=Colors.ACCENT,
+            text_style=ft.TextStyle(color=Colors.TEXT_PRIMARY, size=13),
+            hint_style=ft.TextStyle(color=Colors.TEXT_MUTED, size=13),
+            bgcolor=Colors.BG_ELEVATED,
+            border_radius=8,
+            height=40,
+            content_padding=ft.Padding.symmetric(horizontal=12, vertical=8),
+            width=280,
+        )
+
+        actions = ft.Row(
+            [
+                ft.IconButton(ft.Icons.NOTIFICATIONS_NONE_ROUNDED, icon_color=Colors.TEXT_SECONDARY, icon_size=20),
+                *self.actions,
+                ft.IconButton(ft.Icons.HELP_OUTLINE_ROUNDED, icon_color=Colors.TEXT_SECONDARY, icon_size=20),
+            ],
+            spacing=0,
+        )
+
+        return ft.Row(
+            [title_block, ft.Container(expand=True), search, actions],
+            vertical_alignment=ft.CrossAxisAlignment.CENTER,
+        )

components/layout/DEx_NavItem.py

@@ -0,0 +1,61 @@
+import flet as ft
+from components.theme.DEx_Theme import Colors, Spacing
+
+COMPONENT_VERSION = "0.1.0"
+
+
+class DEx_NavItem(ft.Row):
+    """Versioned sidebar navigation item with the DEx active accent."""
+
+    def __init__(
+        self,
+        icon,
+        label: str,
+        route: str,
+        active: bool = False,
+        on_click=None,
+    ):
+        self.icon_ref = icon
+        self.label = label
+        self.route = route
+        self.active = active
+        self._on_click = on_click
+        super().__init__(
+            controls=[self._build_accent_line(), self._build_icon_label()],
+            spacing=0,
+            tight=True,
+        )
+
+    def _build_accent_line(self) -> ft.Container:
+        return ft.Container(
+            width=3,
+            height=36,
+            bgcolor=Colors.ACCENT if self.active else "transparent",
+            border_radius=ft.BorderRadius.only(top_right=3, bottom_right=3),
+        )
+
+    def _build_icon_label(self) -> ft.Container:
+        return ft.Container(
+            content=ft.Row(
+                [
+                    ft.Icon(
+                        self.icon_ref,
+                        size=18,
+                        color=Colors.ACCENT if self.active else Colors.TEXT_SECONDARY,
+                    ),
+                    ft.Text(
+                        self.label,
+                        size=13,
+                        weight=ft.FontWeight.W_600 if self.active else ft.FontWeight.NORMAL,
+                        color=Colors.TEXT_PRIMARY if self.active else Colors.TEXT_SECONDARY,
+                    ),
+                ],
+                spacing=Spacing.SM,
+            ),
+            bgcolor=f"{Colors.ACCENT}18" if self.active else "transparent",
+            border_radius=ft.BorderRadius.only(top_right=8, bottom_right=8),
+            padding=ft.Padding.symmetric(horizontal=Spacing.MD - 3, vertical=10),
+            expand=True,
+            on_click=lambda e: self._on_click(self.route) if self._on_click else None,
+            ink=True,
+        )

components/layout/DEx_NavigationBar.py

@@ -0,0 +1,30 @@
+import flet as ft
+from components.theme.DEx_Theme import Colors, Spacing
+
+COMPONENT_VERSION = "0.0.1"
+
+
+def DEx_NavBarItem(label: str, icon: str, selected_icon: str | None = None) -> ft.NavigationBarDestination:
+    """Single destination entry for DEx_NavigationBar."""
+    return ft.NavigationBarDestination(
+        label=label,
+        icon=icon,
+        selected_icon=selected_icon or icon,
+    )
+
+
+def DEx_NavigationBar(
+    destinations: list[ft.NavigationBarDestination],
+    selected_index: int = 0,
+    on_change=None,
+) -> ft.NavigationBar:
+    """Bottom navigation bar for mobile-style primary navigation between 3–5 destinations."""
+    return ft.NavigationBar(
+        destinations=destinations,
+        selected_index=selected_index,
+        on_change=on_change,
+        bgcolor=Colors.BG_SURFACE,
+        indicator_color=Colors.ACCENT,
+        shadow_color=ft.Colors.TRANSPARENT,
+        label_behavior=ft.NavigationBarLabelBehavior.ALWAYS_SHOW,
+    )

components/layout/DEx_NavigationDrawer.py

@@ -0,0 +1,60 @@
+import flet as ft
+from components.theme.DEx_Theme import Colors, Spacing
+
+COMPONENT_VERSION = "0.0.1"
+
+
+def DEx_DrawerItem(
+    label: str,
+    icon: str,
+    selected: bool = False,
+    on_click=None,
+) -> ft.Container:
+    """Single row item inside a DEx_NavigationDrawer."""
+    return ft.Container(
+        content=ft.Row(
+            [
+                ft.Icon(
+                    icon,
+                    size=18,
+                    color=Colors.ACCENT if selected else Colors.TEXT_SECONDARY,
+                ),
+                ft.Text(
+                    label,
+                    size=13,
+                    color=Colors.ACCENT if selected else Colors.TEXT_PRIMARY,
+                    weight=ft.FontWeight.W_600 if selected else ft.FontWeight.NORMAL,
+                ),
+            ],
+            spacing=Spacing.MD,
+            vertical_alignment=ft.CrossAxisAlignment.CENTER,
+        ),
+        bgcolor=f"{Colors.ACCENT}22" if selected else ft.Colors.TRANSPARENT,
+        border_radius=Spacing.BUTTON_BORDER_RADIUS,
+        padding=ft.Padding.symmetric(horizontal=Spacing.MD, vertical=10),
+        on_click=on_click,
+        ink=True,
+    )
+
+
+def DEx_NavigationDrawer(
+    items: list[ft.Control],
+    header: ft.Control | None = None,
+    on_dismiss=None,
+) -> ft.NavigationDrawer:
+    """Side sheet navigation drawer for secondary navigation or context panels."""
+    controls: list[ft.Control] = []
+    if header:
+        controls.append(header)
+        controls.append(ft.Container(height=1, bgcolor=Colors.BORDER))
+        controls.append(ft.Container(height=Spacing.SM))
+    controls.extend(items)
+
+    return ft.NavigationDrawer(
+        controls=controls,
+        on_dismiss=on_dismiss,
+        bgcolor=Colors.BG_SURFACE,
+        shadow_color=ft.Colors.TRANSPARENT,
+        indicator_color=f"{Colors.ACCENT}22",
+        indicator_shape=ft.RoundedRectangleBorder(radius=Spacing.BUTTON_BORDER_RADIUS),
+    )

components/layout/DEx_NavigationRail.py

@@ -0,0 +1,42 @@
+import flet as ft
+from components.theme.DEx_Theme import Colors, Spacing
+
+COMPONENT_VERSION = "0.0.1"
+
+
+def DEx_RailItem(
+    label: str,
+    icon: str,
+    selected_icon: str | None = None,
+) -> ft.NavigationRailDestination:
+    """Single destination entry for DEx_NavigationRail."""
+    return ft.NavigationRailDestination(
+        label=label,
+        icon=icon,
+        selected_icon=selected_icon or icon,
+    )
+
+
+def DEx_NavigationRail(
+    destinations: list[ft.NavigationRailDestination],
+    selected_index: int = 0,
+    on_change=None,
+    extended: bool = False,
+    leading: ft.Control | None = None,
+    trailing: ft.Control | None = None,
+) -> ft.NavigationRail:
+    """Compact vertical rail for secondary or desktop navigation."""
+    return ft.NavigationRail(
+        destinations=destinations,
+        selected_index=selected_index,
+        on_change=on_change,
+        extended=extended,
+        leading=leading,
+        trailing=trailing,
+        bgcolor=Colors.BG_SURFACE,
+        indicator_color=Colors.ACCENT,
+        indicator_shape=ft.RoundedRectangleBorder(radius=Spacing.BUTTON_BORDER_RADIUS),
+        min_width=56,
+        min_extended_width=200,
+        group_alignment=-1.0,
+    )

components/layout/DEx_ResponsiveRow.py

@@ -0,0 +1,42 @@
+import flet as ft
+from components.theme.DEx_Theme import Colors, Spacing
+
+COMPONENT_VERSION = "0.0.1"
+
+
+def DEx_ResponsiveRow(
+    controls: list | None = None,
+    columns: int = 12,
+    spacing: int | None = None,
+    run_spacing: int | None = None,
+    vertical_alignment: ft.CrossAxisAlignment = ft.CrossAxisAlignment.START,
+) -> ft.ResponsiveRow:
+    """Grid responsivo de 12 colunas. Defina col= nos controles filhos."""
+    return ft.ResponsiveRow(
+        controls=controls or [],
+        columns=columns,
+        spacing=spacing if spacing is not None else Spacing.MD,
+        run_spacing=run_spacing if run_spacing is not None else Spacing.MD,
+        vertical_alignment=vertical_alignment,
+    )
+
+
+def DEx_Col(
+    content: ft.Control,
+    xs: int = 12,
+    sm: int | None = None,
+    md: int | None = None,
+    lg: int | None = None,
+    xl: int | None = None,
+) -> ft.Container:
+    """Coluna responsiva para uso dentro de DEx_ResponsiveRow."""
+    col_spec: dict = {"xs": xs}
+    if sm is not None:
+        col_spec["sm"] = sm
+    if md is not None:
+        col_spec["md"] = md
+    if lg is not None:
+        col_spec["lg"] = lg
+    if xl is not None:
+        col_spec["xl"] = xl
+    return ft.Container(content=content, col=col_spec)