@flowtomic/ui 0.1.0 → 0.1.1

package/dist/components/molecules/index.js

@@ -0,0 +1,38 @@
+/**
+ * Molecules - Componentes Compostos
+ * Atomic Design: Componentes compostos por múltiplos atoms
+ */
+export { Modal, ModalBody, ModalContent, ModalFooter, ModalTrigger, } from "./animation/animated-modal";
+export { AnimatedSlidingNumber } from "./animation/animated-sliding-number";
+export { ButtonCounter } from "./animation/button-counter";
+export { AuthFormErrorMessage, AuthNavigationLink, PasswordInput } from "./auth";
+export { SocialLoginButtons } from "./auth/social-login-buttons";
+export { Artifact, ArtifactAction, ArtifactActions, ArtifactClose, ArtifactContent, ArtifactDescription, ArtifactHeader, ArtifactTitle, } from "./data-display/artifact";
+export { BarChart } from "./data-display/bar-chart";
+export { ChartAreaInteractive } from "./data-display/chart-area-interactive";
+export { ChartBarInteractive } from "./data-display/chart-bar-interactive";
+export { Checkpoint, CheckpointIcon, CheckpointTrigger } from "./data-display/checkpoint";
+export { CircularProgressChart } from "./data-display/circular-progress-chart";
+export { DataTable } from "./data-display/data-table";
+export { Message, MessageAction, MessageActions, MessageAttachment, MessageAttachments, MessageBranch, MessageBranchContent, MessageBranchNext, MessageBranchPage, MessageBranchPrevious, MessageBranchSelector, MessageContent, MessageResponse, MessageToolbar, } from "./data-display/message";
+export { ProjectList } from "./data-display/project-list";
+export { ReminderCard } from "./data-display/reminder-card";
+export { Source, Sources, SourcesContent, SourcesTrigger } from "./data-display/sources";
+export { StatCard } from "./data-display/stat-card";
+export { Suggestion, Suggestions } from "./data-display/suggestion";
+export { Task, TaskContent, TaskItem, TaskItemFile, TaskTrigger } from "./data-display/task";
+export { TeamMemberList } from "./data-display/team-member-list";
+export { TimeTracker } from "./data-display/time-tracker";
+export { Tool, ToolContent, ToolHeader, ToolInput, ToolOutput } from "./data-display/tool";
+export { Confirmation, ConfirmationAccepted, ConfirmationAction, ConfirmationActions, ConfirmationRejected, ConfirmationRequest, ConfirmationTitle, } from "./feedback/confirmation";
+export { Canvas } from "./flow/canvas";
+export { Connection } from "./flow/connection";
+export { ButtonGroup, ButtonGroupSeparator, ButtonGroupText } from "./forms/button-group";
+export { ImageDropzone } from "./forms/image-dropzone";
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupTextarea, } from "./forms/input-group";
+export { Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, } from "./forms/item";
+export { DashboardHeader } from "./layout/dashboard-header";
+export { MenuDock } from "./navigation/menu-dock";
+export { SidebarNavigation } from "./navigation/sidebar-navigation";
+export { ThemeToggleButton } from "./theme/theme-toggle-button/theme-toggle-button";
+export { AnimatedShinyText } from "./typography";

package/dist/components/molecules/layout/dashboard-header/dashboard-header.d.ts

@@ -0,0 +1,69 @@
+/**
+ * DashboardHeader - Componente Visual
+ *
+ * Header com busca, notificações e perfil do usuário
+ */
+export interface DashboardUser {
+    name: string;
+    email: string;
+    avatar?: string;
+}
+export interface Notification {
+    id: string;
+    title: string;
+    description?: string;
+    unread?: boolean;
+}
+export interface DashboardHeaderProps {
+    /**
+     * Valor da busca
+     */
+    searchValue?: string;
+    /**
+     * Callback quando a busca muda
+     */
+    onSearchChange?: (value: string) => void;
+    /**
+     * Placeholder do campo de busca
+     * @default "Search task"
+     */
+    searchPlaceholder?: string;
+    /**
+     * Atalho de teclado para busca
+     * @default "⌘F"
+     */
+    searchShortcut?: string;
+    /**
+     * Informações do usuário
+     */
+    user?: DashboardUser;
+    /**
+     * Lista de notificações
+     */
+    notifications?: Notification[];
+    /**
+     * Lista de mensagens
+     */
+    messages?: Notification[];
+    /**
+     * Callback quando uma notificação é clicada
+     */
+    onNotificationClick?: (notification: Notification) => void;
+    /**
+     * Callback quando uma mensagem é clicada
+     */
+    onMessageClick?: (message: Notification) => void;
+    /**
+     * Callback quando o perfil é clicado
+     */
+    onProfileClick?: () => void;
+    /**
+     * Classe CSS adicional
+     */
+    className?: string;
+}
+/**
+ * Componente de header do dashboard
+ */
+export declare function DashboardHeader({ searchValue, onSearchChange, searchPlaceholder, searchShortcut, user, notifications, messages, onNotificationClick, onMessageClick, onProfileClick, className, }: DashboardHeaderProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=dashboard-header.d.ts.map

package/dist/components/molecules/layout/dashboard-header/dashboard-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dashboard-header.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/layout/dashboard-header/dashboard-header.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAeH,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,oBAAoB;IACnC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAEzC;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IACH,IAAI,CAAC,EAAE,aAAa,CAAC;IAErB;;OAEG;IACH,aAAa,CAAC,EAAE,YAAY,EAAE,CAAC;IAE/B;;OAEG;IACH,QAAQ,CAAC,EAAE,YAAY,EAAE,CAAC;IAE1B;;OAEG;IACH,mBAAmB,CAAC,EAAE,CAAC,YAAY,EAAE,YAAY,KAAK,IAAI,CAAC;IAE3D;;OAEG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;IAEjD;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAE5B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAcD;;GAEG;AACH,wBAAgB,eAAe,CAAC,EAC9B,WAAgB,EAChB,cAAc,EACd,iBAAiC,EACjC,cAAqB,EACrB,IAAI,EACJ,aAAkB,EAClB,QAAa,EACb,mBAAmB,EACnB,cAAc,EACd,cAAc,EACd,SAAS,GACV,EAAE,oBAAoB,2CAsItB"}

package/dist/components/molecules/layout/dashboard-header/dashboard-header.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * DashboardHeader - Componente Visual
+ *
+ * Header com busca, notificações e perfil do usuário
+ */
+import { Bell, MessageSquare, Search, User } from "lucide-react";
+import { cn } from "@/lib/utils";
+import { Avatar, AvatarFallback, AvatarImage, Badge, Button, Input } from "../../../atoms";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, } from "../../../atoms/actions/dropdown-menu";
+/**
+ * Obtém iniciais do nome
+ */
+function getInitials(name) {
+    return name
+        .split(" ")
+        .map((n) => n[0])
+        .join("")
+        .toUpperCase()
+        .slice(0, 2);
+}
+/**
+ * Componente de header do dashboard
+ */
+export function DashboardHeader({ searchValue = "", onSearchChange, searchPlaceholder = "Search task", searchShortcut = "⌘F", user, notifications = [], messages = [], onNotificationClick, onMessageClick, onProfileClick, className, }) {
+    const unreadNotifications = notifications.filter((n) => n.unread).length;
+    const unreadMessages = messages.filter((m) => m.unread).length;
+    return (_jsxs("header", { className: cn("flex items-center justify-between gap-4 border-b bg-background px-6 py-4", className), children: [_jsxs("div", { className: "relative flex-1 max-w-md", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { type: "search", placeholder: searchPlaceholder, value: searchValue, onChange: (e) => onSearchChange?.(e.target.value), className: "pl-9 pr-20" }), _jsx("div", { className: "absolute right-3 top-1/2 -translate-y-1/2 text-xs text-muted-foreground", children: searchShortcut })] }), _jsxs("div", { className: "flex items-center gap-2", children: [messages.length > 0 && (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "icon", className: "relative", children: [_jsx(MessageSquare, { className: "h-5 w-5" }), unreadMessages > 0 && (_jsx(Badge, { variant: "destructive", className: "absolute -top-1 -right-1 h-5 w-5 flex items-center justify-center p-0 text-xs", children: unreadMessages }))] }) }), _jsxs(DropdownMenuContent, { align: "end", className: "w-80", children: [_jsx(DropdownMenuLabel, { children: "Messages" }), _jsx(DropdownMenuSeparator, {}), messages.map((message) => (_jsx(DropdownMenuItem, { onClick: () => onMessageClick?.(message), className: cn(message.unread && "bg-accent"), children: _jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("div", { className: "font-medium", children: message.title }), message.description && (_jsx("div", { className: "text-xs text-muted-foreground", children: message.description }))] }) }, message.id)))] })] })), notifications.length > 0 && (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "icon", className: "relative", children: [_jsx(Bell, { className: "h-5 w-5" }), unreadNotifications > 0 && (_jsx(Badge, { variant: "destructive", className: "absolute -top-1 -right-1 h-5 w-5 flex items-center justify-center p-0 text-xs", children: unreadNotifications }))] }) }), _jsxs(DropdownMenuContent, { align: "end", className: "w-80", children: [_jsx(DropdownMenuLabel, { children: "Notifications" }), _jsx(DropdownMenuSeparator, {}), notifications.map((notification) => (_jsx(DropdownMenuItem, { onClick: () => onNotificationClick?.(notification), className: cn(notification.unread && "bg-accent"), children: _jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("div", { className: "font-medium", children: notification.title }), notification.description && (_jsx("div", { className: "text-xs text-muted-foreground", children: notification.description }))] }) }, notification.id)))] })] })), user && (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", className: "flex items-center gap-2 h-auto py-2", children: [_jsxs(Avatar, { className: "h-8 w-8", children: [_jsx(AvatarImage, { src: user.avatar, alt: user.name }), _jsx(AvatarFallback, { children: user.avatar ? _jsx(User, { className: "h-4 w-4" }) : getInitials(user.name) })] }), _jsxs("div", { className: "flex flex-col items-start", children: [_jsx("span", { className: "text-sm font-medium", children: user.name }), _jsx("span", { className: "text-xs text-muted-foreground", children: user.email })] })] }) }), _jsxs(DropdownMenuContent, { align: "end", children: [_jsx(DropdownMenuLabel, { children: "My Account" }), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuItem, { onClick: onProfileClick, children: "Profile" }), _jsx(DropdownMenuItem, { children: "Settings" }), _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuItem, { children: "Logout" })] })] }))] })] }));
+}

package/dist/components/molecules/layout/dashboard-header/index.d.ts

@@ -0,0 +1,3 @@
+export type { DashboardHeaderProps, DashboardUser, Notification, } from "./dashboard-header";
+export { DashboardHeader } from "./dashboard-header";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/layout/dashboard-header/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/layout/dashboard-header/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,oBAAoB,EACpB,aAAa,EACb,YAAY,GACb,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/components/molecules/layout/dashboard-header/index.js

@@ -0,0 +1 @@
+export { DashboardHeader } from "./dashboard-header";

package/dist/components/molecules/navigation/menu-dock/index.d.ts

@@ -0,0 +1,3 @@
+export type { MenuDockItem, MenuDockProps } from "./menu-dock";
+export { MenuDock } from "./menu-dock";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/navigation/menu-dock/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/navigation/menu-dock/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC/D,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC"}

package/dist/components/molecules/navigation/menu-dock/index.js

@@ -0,0 +1 @@
+export { MenuDock } from "./menu-dock";

package/dist/components/molecules/navigation/menu-dock/menu-dock.d.ts

@@ -0,0 +1,30 @@
+/**
+ * MenuDock - Componente Molecule
+ *
+ * Componente de dock de menu com animação e suporte a múltiplos itens
+ */
+import type React from "react";
+type IconComponentType = React.ElementType<{
+    className?: string;
+}>;
+export interface MenuDockItem {
+    id?: string;
+    label: string;
+    icon: IconComponentType;
+    onClick?: () => void;
+    path?: string;
+}
+export interface MenuDockProps {
+    items?: MenuDockItem[];
+    className?: string;
+    variant?: "default" | "compact" | "large";
+    orientation?: "horizontal" | "vertical";
+    showLabels?: boolean;
+    animated?: boolean;
+    defaultActiveIndex?: number;
+    activeIndex?: number;
+    onActiveIndexChange?: (index: number) => void;
+}
+export declare const MenuDock: React.FC<MenuDockProps>;
+export {};
+//# sourceMappingURL=menu-dock.d.ts.map

package/dist/components/molecules/navigation/menu-dock/menu-dock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"menu-dock.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/navigation/menu-dock/menu-dock.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAMH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,KAAK,iBAAiB,GAAG,KAAK,CAAC,WAAW,CAAC;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC,CAAC;AAEnE,MAAM,WAAW,YAAY;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,iBAAiB,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAC1C,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/C;AAUD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAgK5C,CAAC"}

package/dist/components/molecules/navigation/menu-dock/menu-dock.js

@@ -0,0 +1,97 @@
+/**
+ * MenuDock - Componente Molecule
+ *
+ * Componente de dock de menu com animação e suporte a múltiplos itens
+ */
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useAnimatedIndicator } from "@flowtomic/logic";
+import { motion, useReducedMotion } from "motion/react";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { cn } from "@/lib/utils";
+const defaultItems = [
+    { label: "home", icon: () => null },
+    { label: "work", icon: () => null },
+    { label: "calendar", icon: () => null },
+    { label: "security", icon: () => null },
+    { label: "settings", icon: () => null },
+];
+export const MenuDock = ({ items, className, variant = "default", orientation = "horizontal", showLabels = true, animated = true, defaultActiveIndex = 0, activeIndex: controlledActiveIndex, onActiveIndexChange, }) => {
+    const finalItems = useMemo(() => {
+        const isValid = items && Array.isArray(items) && items.length >= 2 && items.length <= 8;
+        if (!isValid) {
+            console.warn("MenuDock: 'items' prop is invalid or missing. Using default items.", items);
+            return defaultItems;
+        }
+        return items;
+    }, [items]);
+    const [internalActiveIndex, setInternalActiveIndex] = useState(defaultActiveIndex);
+    // Usar índice controlado se fornecido, caso contrário usar estado interno
+    const isControlled = controlledActiveIndex !== undefined;
+    const activeIndex = isControlled ? controlledActiveIndex : internalActiveIndex;
+    const setActiveIndex = (index) => {
+        if (!isControlled) {
+            setInternalActiveIndex(index);
+        }
+        onActiveIndexChange?.(index);
+    };
+    const containerRef = useRef(null);
+    const shouldReduceMotion = useReducedMotion();
+    // Para o underline, precisamos rastrear o texto, não o botão
+    const textRefs = useRef([]);
+    useEffect(() => {
+        if (activeIndex >= finalItems.length && !isControlled) {
+            setInternalActiveIndex(0);
+        }
+    }, [finalItems, activeIndex, isControlled]);
+    // Usar o hook apenas quando showLabels e horizontal
+    const { indicatorStyle, registerElement } = useAnimatedIndicator({
+        containerRef: containerRef,
+        activeSelector: '[data-active="true"]',
+        getElementValue: (element) => {
+            return element.getAttribute("data-index") || "";
+        },
+        updateOnResize: showLabels && orientation === "horizontal",
+    });
+    const sizeClasses = {
+        default: "p-3",
+        compact: "p-2",
+        large: "p-4",
+    };
+    const iconSizes = {
+        default: "w-5 h-5",
+        compact: "w-4 h-4",
+        large: "w-6 h-6",
+    };
+    return (_jsxs("nav", { ref: containerRef, className: cn("relative flex", orientation === "horizontal" ? "flex-row" : "flex-col", "items-center gap-2", "bg-background border border-border rounded-lg", "p-2", className), "aria-label": "Menu dock", children: [finalItems.map((item, index) => {
+                const Icon = item.icon;
+                const isActive = activeIndex === index;
+                return (_jsxs("button", { type: "button", "data-active": isActive, "data-index": index.toString(), onClick: () => {
+                        setActiveIndex(index);
+                        item.onClick?.();
+                    }, className: cn("relative flex items-center gap-2", "px-3 py-2 rounded-md", "transition-all duration-200", "hover:bg-accent hover:text-accent-foreground", isActive && "bg-accent text-accent-foreground", sizeClasses[variant]), "aria-label": item.label, "aria-current": isActive ? "page" : undefined, children: [_jsx(Icon, { className: cn(iconSizes[variant], isActive && "text-primary") }), showLabels && (_jsx("span", { ref: (el) => {
+                                textRefs.current[index] = el;
+                                if (showLabels && orientation === "horizontal" && el) {
+                                    registerElement(el, index.toString());
+                                }
+                            }, "data-active": isActive, "data-index": index.toString(), className: cn("text-sm font-medium", "transition-all duration-200", isActive && "text-primary"), children: item.label }))] }, item.id || `menu-item-${index}`));
+            }), showLabels && orientation === "horizontal" && (_jsx(motion.div, { className: "absolute bottom-0 h-0.5 bg-primary", initial: false, animate: shouldReduceMotion
+                    ? {
+                        opacity: indicatorStyle.opacity,
+                    }
+                    : {
+                        x: indicatorStyle.left,
+                        width: indicatorStyle.width,
+                        opacity: indicatorStyle.opacity,
+                    }, transition: {
+                    type: "spring",
+                    stiffness: 380,
+                    damping: 30,
+                    mass: 0.5,
+                }, style: {
+                    pointerEvents: "none",
+                    left: 0,
+                    bottom: 0,
+                    height: "2px",
+                } }))] }));
+};

package/dist/components/molecules/navigation/sidebar-navigation/index.d.ts

@@ -0,0 +1,3 @@
+export type { MobileAppCard, NavigationItem, SidebarNavigationProps, } from "./sidebar-navigation";
+export { SidebarNavigation } from "./sidebar-navigation";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/navigation/sidebar-navigation/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/navigation/sidebar-navigation/index.ts"],"names":[],"mappings":"AAAA,YAAY,EACV,aAAa,EACb,cAAc,EACd,sBAAsB,GACvB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/components/molecules/navigation/sidebar-navigation/index.js

@@ -0,0 +1 @@
+export { SidebarNavigation } from "./sidebar-navigation";

package/dist/components/molecules/navigation/sidebar-navigation/sidebar-navigation.d.ts

@@ -0,0 +1,56 @@
+/**
+ * SidebarNavigation - Componente Visual
+ *
+ * Menu lateral completo com logo, seções de navegação e card de download mobile
+ */
+import type React from "react";
+export interface NavigationItem {
+    id: string;
+    label: string;
+    icon?: React.ReactNode;
+    href?: string;
+    onClick?: () => void;
+    active?: boolean;
+}
+export interface MobileAppCard {
+    title: string;
+    description?: string;
+    buttonText?: string;
+    onDownload?: () => void;
+}
+export interface SidebarNavigationProps {
+    /**
+     * Logo do aplicativo
+     */
+    logo?: React.ReactNode;
+    /**
+     * Título do aplicativo
+     * @default "Flowtomic"
+     */
+    appName?: string;
+    /**
+     * Itens do menu principal
+     */
+    menuItems?: NavigationItem[];
+    /**
+     * Itens do menu geral (Settings, Help, Logout)
+     */
+    generalItems?: NavigationItem[];
+    /**
+     * Card de download mobile
+     */
+    mobileAppCard?: MobileAppCard;
+    /**
+     * Callback quando um item é clicado
+     */
+    onNavigate?: (item: NavigationItem) => void;
+    /**
+     * Classe CSS adicional
+     */
+    className?: string;
+}
+/**
+ * Componente de navegação lateral
+ */
+export declare function SidebarNavigation({ logo, appName, menuItems, generalItems, mobileAppCard, onNavigate, className, }: SidebarNavigationProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=sidebar-navigation.d.ts.map

package/dist/components/molecules/navigation/sidebar-navigation/sidebar-navigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-navigation.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/navigation/sidebar-navigation/sidebar-navigation.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAc/B,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAED,MAAM,WAAW,sBAAsB;IACrC;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEvB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,SAAS,CAAC,EAAE,cAAc,EAAE,CAAC;IAE7B;;OAEG;IACH,YAAY,CAAC,EAAE,cAAc,EAAE,CAAC;IAEhC;;OAEG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;IAE9B;;OAEG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IAE5C;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,IAAI,EACJ,OAAqB,EACrB,SAAc,EACd,YAAiB,EACjB,aAAa,EACb,UAAU,EACV,SAAS,GACV,EAAE,sBAAsB,2CAqIxB"}

package/dist/components/molecules/navigation/sidebar-navigation/sidebar-navigation.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * SidebarNavigation - Componente Visual
+ *
+ * Menu lateral completo com logo, seções de navegação e card de download mobile
+ */
+import { CheckCircle2, Download, LogOut, Settings } from "lucide-react";
+import { cn } from "@/lib/utils";
+import { Button, Card, CardContent, Separator } from "../../../atoms";
+import { Sidebar, SidebarContent, SidebarGroup, SidebarGroupContent, SidebarGroupLabel, SidebarMenu, SidebarMenuButton, SidebarMenuItem, } from "../../../atoms/layout";
+/**
+ * Componente de navegação lateral
+ */
+export function SidebarNavigation({ logo, appName = "Flowtomic", menuItems = [], generalItems = [], mobileAppCard, onNavigate, className, }) {
+    const defaultMenuItems = menuItems.length > 0
+        ? menuItems
+        : [
+            { id: "dashboard", label: "Dashboard", active: true },
+            { id: "tasks", label: "Tasks" },
+            { id: "calendar", label: "Calendar" },
+            { id: "analytics", label: "Analytics" },
+            { id: "team", label: "Team" },
+        ];
+    const defaultGeneralItems = generalItems.length > 0
+        ? generalItems
+        : [
+            { id: "settings", label: "Settings", icon: _jsx(Settings, { className: "h-4 w-4" }) },
+            { id: "help", label: "Help" },
+            { id: "logout", label: "Logout", icon: _jsx(LogOut, { className: "h-4 w-4" }) },
+        ];
+    const handleItemClick = (item) => {
+        onNavigate?.(item);
+        item.onClick?.();
+    };
+    return (_jsx(Sidebar, { className: cn("border-r", className), children: _jsxs(SidebarContent, { children: [_jsx("div", { className: "flex items-center gap-2 px-4 py-6", children: logo || (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(CheckCircle2, { className: "h-6 w-6 text-primary" }), _jsx("span", { className: "font-bold text-lg", children: appName })] })) }), _jsx(Separator, {}), _jsxs(SidebarGroup, { children: [_jsx(SidebarGroupLabel, { children: "MENU" }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: defaultMenuItems.map((item) => (_jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { onClick: () => handleItemClick(item), isActive: item.active, asChild: !!item.href, children: item.href ? (_jsxs("a", { href: item.href, children: [item.icon, _jsx("span", { children: item.label })] })) : (_jsxs(_Fragment, { children: [item.icon, _jsx("span", { children: item.label })] })) }) }, item.id))) }) })] }), _jsx(Separator, {}), _jsxs(SidebarGroup, { children: [_jsx(SidebarGroupLabel, { children: "GENERAL" }), _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: defaultGeneralItems.map((item) => (_jsx(SidebarMenuItem, { children: _jsx(SidebarMenuButton, { onClick: () => handleItemClick(item), isActive: item.active, asChild: !!item.href, children: item.href ? (_jsxs("a", { href: item.href, children: [item.icon, _jsx("span", { children: item.label })] })) : (_jsxs(_Fragment, { children: [item.icon, _jsx("span", { children: item.label })] })) }) }, item.id))) }) })] }), mobileAppCard && (_jsxs(_Fragment, { children: [_jsx(Separator, { className: "mt-auto" }), _jsx("div", { className: "p-4", children: _jsx(Card, { className: "bg-primary text-primary-foreground", children: _jsx(CardContent, { className: "p-4", children: _jsxs("div", { className: "space-y-2", children: [_jsx("div", { className: "font-semibold text-sm", children: mobileAppCard.title }), mobileAppCard.description && (_jsx("div", { className: "text-xs opacity-90", children: mobileAppCard.description })), _jsxs(Button, { variant: "secondary", size: "sm", className: "w-full mt-3", onClick: mobileAppCard.onDownload, children: [_jsx(Download, { className: "h-4 w-4 mr-2" }), mobileAppCard.buttonText || "Download our Mobile App"] })] }) }) }) })] }))] }) }));
+}

package/dist/components/molecules/theme/theme-toggle-button/index.d.ts

@@ -0,0 +1,3 @@
+export type { StartPosition, ThemeToggleButtonProps } from "./theme-toggle-button";
+export { ThemeToggleButton } from "./theme-toggle-button";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/theme/theme-toggle-button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/theme/theme-toggle-button/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,aAAa,EAAE,sBAAsB,EAAE,MAAM,uBAAuB,CAAC;AACnF,OAAO,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC"}

package/dist/components/molecules/theme/theme-toggle-button/index.js

@@ -0,0 +1 @@
+export { ThemeToggleButton } from "./theme-toggle-button";

package/dist/components/molecules/theme/theme-toggle-button/theme-toggle-button.d.ts

@@ -0,0 +1,58 @@
+/**
+ * ThemeToggleButton - Componente de Toggle de Tema com Animação Circle Blur
+ *
+ * Componente consolidado para alternância de tema com animação suave
+ * usando View Transitions API e variante circle-blur (soft-edge circle)
+ *
+ * NOTA: Este componente requer que o projeto forneça um hook useThemeToggle
+ * ou props para controlar o tema. Por padrão, aceita props diretas.
+ */
+export type StartPosition = "center" | "top-left" | "top-right" | "bottom-left" | "bottom-right";
+export interface ThemeToggleButtonProps {
+    /**
+     * Tamanho do botão
+     * @default 'icon'
+     */
+    size?: "sm" | "md" | "lg" | "icon";
+    /**
+     * Posição inicial da animação circle-blur
+     * @default 'top-right'
+     */
+    start?: StartPosition;
+    /**
+     * Classes CSS adicionais
+     */
+    className?: string;
+    /**
+     * Desabilitar o botão
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Tema atual ('light' | 'dark')
+     * Se não fornecido, tenta detectar do sistema
+     */
+    theme?: "light" | "dark";
+    /**
+     * Callback quando o tema é alternado
+     */
+    onThemeChange?: (theme: "light" | "dark") => void;
+}
+/**
+ * Componente de toggle de tema com animação circle-blur
+ *
+ * Usa View Transitions API para transições suaves entre temas
+ * com animação de círculo expandindo com blur (soft-edge)
+ *
+ * @example
+ * ```tsx
+ * <ThemeToggleButton
+ *   size="icon"
+ *   start="top-right"
+ *   theme={currentTheme}
+ *   onThemeChange={setTheme}
+ * />
+ * ```
+ */
+export declare function ThemeToggleButton({ size, start, className, disabled, theme: controlledTheme, onThemeChange, }: ThemeToggleButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=theme-toggle-button.d.ts.map

package/dist/components/molecules/theme/theme-toggle-button/theme-toggle-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-toggle-button.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/theme/theme-toggle-button/theme-toggle-button.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAOH,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,UAAU,GAAG,WAAW,GAAG,aAAa,GAAG,cAAc,CAAC;AAEjG,MAAM,WAAW,sBAAsB;IACrC;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;IAEnC;;;OAGG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC;IAEtB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAEzB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,KAAK,IAAI,CAAC;CACnD;AAgBD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,IAAa,EACb,KAAmB,EACnB,SAAS,EACT,QAAgB,EAChB,KAAK,EAAE,eAAe,EACtB,aAAa,GACd,EAAE,sBAAsB,2CAgMxB"}