npm - @tree-ia/design-system - Versions diffs - 1.5.7 → 1.6.0 - Mend

@tree-ia/design-system 1.5.7 → 1.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/dist/index.mjs CHANGED Viewed

@@ -1,7 +1,7 @@
 import React, { createContext, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { createPortal } from "react-dom";
-import { AlertCircle, AlertOctagon, AlertTriangle, ArrowDown, ArrowUp, ArrowUpDown, Check, CheckCircle, ChevronDown, ChevronLeft, ChevronRight, ChevronsLeft, ChevronsRight, File, GripVertical, Image, Inbox, Info, LogOut, Monitor, Moon, Search, Sun, Upload, User, X, XCircle } from "lucide-react";
+import { AlertCircle, AlertOctagon, AlertTriangle, ArrowDown, ArrowUp, ArrowUpDown, Check, CheckCircle, ChevronDown, ChevronLeft, ChevronRight, ChevronsLeft, ChevronsRight, Copy, File, GripVertical, Image, Inbox, Info, Lightbulb, LogOut, Monitor, Moon, Search, ShieldAlert, Sun, Upload, User, X, XCircle } from "lucide-react";
 import { Bar, Doughnut, Line } from "react-chartjs-2";
 import { ArcElement, BarElement, CategoryScale, Chart, Filler, Legend, LineElement, LinearScale, PointElement, Title as Title$1, Tooltip as Tooltip$1 } from "chart.js";
 import { createColumnHelper, flexRender, getCoreRowModel, getFilteredRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table";
@@ -35,7 +35,7 @@ function Loading({ size = "md", className = "", text, textColor, color, variant
 //#endregion
 //#region src/components/Button/index.tsx
-const cn$30 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$32 = (...classes) => classes.filter(Boolean).join(" ");
 function Button({ children, variant = "primary", size = "md", isLoading = false, icon, iconPosition = "left", className, disabled, ...props }) {
 	const baseStyles = "font-medium rounded-lg transition-all duration-200 ease-out cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed inline-flex items-center justify-center focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--dashboard-primary,#2563EB)] active:scale-[0.97]";
 	const variantStyles = {
@@ -56,7 +56,7 @@ function Button({ children, variant = "primary", size = "md", isLoading = false,
 	};
 	const isIconOnly = !!icon && (children === void 0 || children === null || typeof children === "string" && children.trim() === "");
 	return /* @__PURE__ */ jsx("button", {
-		className: cn$30(baseStyles, variantStyles[variant], isIconOnly ? iconOnlySizeStyles[size] : sizeStyles[size], className),
+		className: cn$32(baseStyles, variantStyles[variant], isIconOnly ? iconOnlySizeStyles[size] : sizeStyles[size], className),
 		disabled: disabled || isLoading,
 		...props,
 		children: isLoading ? /* @__PURE__ */ jsxs("span", {
@@ -81,7 +81,7 @@ function Button({ children, variant = "primary", size = "md", isLoading = false,
 //#endregion
 //#region src/components/Input/index.tsx
-const cn$29 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$31 = (...classes) => classes.filter(Boolean).join(" ");
 const Input = React.forwardRef(({ className, type = "text", label, error, children, id, ...props }, ref) => {
 	const inputId = id || (label ? `input-${label.toLowerCase().replace(/\s+/g, "-")}` : void 0);
 	return /* @__PURE__ */ jsxs("div", {
@@ -97,7 +97,7 @@ const Input = React.forwardRef(({ className, type = "text", label, error, childr
 				children: [/* @__PURE__ */ jsx("input", {
 					type,
 					id: inputId,
-					className: cn$29("flex h-10 w-full rounded-md border border-[var(--dashboard-text-secondary,#6b7280)]/30 bg-[var(--dashboard-surface,#ffffff)] px-3 py-2 text-sm text-[var(--dashboard-text-primary,#2d2d2d)] shadow-sm transition-colors duration-200 focus:border-[var(--dashboard-primary,#37a501)] placeholder:text-[var(--dashboard-text-secondary,#6b7280)] focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50", error ? "border-[var(--dashboard-status-danger,#EF4444)] focus:border-[var(--dashboard-status-danger,#EF4444)]" : void 0, children ? "pr-10" : void 0, className),
+					className: cn$31("flex h-10 w-full rounded-md border border-[var(--dashboard-text-secondary,#6b7280)]/30 bg-[var(--dashboard-surface,#ffffff)] px-3 py-2 text-sm text-[var(--dashboard-text-primary,#2d2d2d)] shadow-sm transition-colors duration-200 focus:border-[var(--dashboard-primary,#37a501)] placeholder:text-[var(--dashboard-text-secondary,#6b7280)] focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50", error ? "border-[var(--dashboard-status-danger,#EF4444)] focus:border-[var(--dashboard-status-danger,#EF4444)]" : void 0, children ? "pr-10" : void 0, className),
 					ref,
 					...props
 				}), children && /* @__PURE__ */ jsx("div", {
@@ -361,32 +361,23 @@ function TableEmpty({ message, icon }) {
 //#endregion
 //#region src/components/Modal/index.tsx
 const ANIMATION_MS = 200;
+const sizeClasses$2 = {
+	small: "max-w-sm",
+	medium: "max-w-md",
+	large: "max-w-lg",
+	largeXl: "max-w-4xl",
+	extraLarge: "max-w-screen-xl"
+};
 function Modal({ isOpen, onClose, onSave, title = "", children, showFooter = false, saveButtonText = "Salvar", cancelButtonText = "Cancelar", size = "medium", disableSaveButton = false, saveButtonVariant = "primary", closeOnEscape = true, closeOnOverlayClick = true }) {
-	const [isClosing, setIsClosing] = useState(false);
-	const [shouldRender, setShouldRender] = useState(isOpen);
+	const [shouldRender, setShouldRender] = useState(false);
 	const modalRef = useRef(null);
-	const prevIsOpenRef = useRef(false);
-	const sizeClasses = {
-		small: "max-w-sm",
-		medium: "max-w-md",
-		large: "max-w-lg",
-		largeXl: "max-w-4xl",
-		extraLarge: "max-w-screen-xl"
-	};
+	if (isOpen && !shouldRender) setShouldRender(true);
+	const isClosing = shouldRender && !isOpen;
 	useEffect(() => {
-		if (isOpen && !prevIsOpenRef.current) {
-			setShouldRender(true);
-			setIsClosing(false);
-		} else if (!isOpen && prevIsOpenRef.current) {
-			setIsClosing(true);
-			const timer = setTimeout(() => {
-				setShouldRender(false);
-				setIsClosing(false);
-			}, ANIMATION_MS);
-			return () => clearTimeout(timer);
-		}
-		prevIsOpenRef.current = isOpen;
-	}, [isOpen]);
+		if (!isClosing) return;
+		const timer = setTimeout(() => setShouldRender(false), ANIMATION_MS);
+		return () => clearTimeout(timer);
+	}, [isClosing]);
 	const handleClose = useCallback(() => {
 		onClose();
 	}, [onClose]);
@@ -399,7 +390,7 @@ function Modal({ isOpen, onClose, onSave, title = "", children, showFooter = fal
 		};
 	}, [shouldRender]);
 	useEffect(() => {
-		if (!closeOnOverlayClick || !shouldRender || isClosing) return;
+		if (!closeOnOverlayClick || !shouldRender || !isOpen) return;
 		const handleClickOutside = (event) => {
 			const target = event.target;
 			if (target.closest("[data-modal-ignore]")) return;
@@ -410,12 +401,12 @@ function Modal({ isOpen, onClose, onSave, title = "", children, showFooter = fal
 		return () => document.removeEventListener("mousedown", handleClickOutside);
 	}, [
 		shouldRender,
-		isClosing,
+		isOpen,
 		handleClose,
 		closeOnOverlayClick
 	]);
 	useEffect(() => {
-		if (!closeOnEscape || !shouldRender || isClosing) return;
+		if (!closeOnEscape || !shouldRender || !isOpen) return;
 		const handleEscKey = (event) => {
 			if (event.key === "Escape") handleClose();
 		};
@@ -423,11 +414,11 @@ function Modal({ isOpen, onClose, onSave, title = "", children, showFooter = fal
 		return () => document.removeEventListener("keydown", handleEscKey);
 	}, [
 		shouldRender,
-		isClosing,
+		isOpen,
 		handleClose,
 		closeOnEscape
 	]);
-	if (!shouldRender && !isOpen) return null;
+	if (!shouldRender) return null;
 	return /* @__PURE__ */ jsx("div", {
 		className: `fixed inset-0 z-[10000] flex items-center justify-center bg-black/50 backdrop-blur-sm p-4 ${isClosing ? "dashboard-animate-fade-out" : "dashboard-animate-fade-in"}`,
 		"aria-modal": "true",
@@ -435,7 +426,7 @@ function Modal({ isOpen, onClose, onSave, title = "", children, showFooter = fal
 		"aria-labelledby": title ? "modal-title" : void 0,
 		children: /* @__PURE__ */ jsxs("div", {
 			ref: modalRef,
-			className: `w-full rounded-2xl bg-[var(--dashboard-surface,#ffffff)] border border-[var(--dashboard-text-secondary,#64748B)]/10 dashboard-shadow-xl ${sizeClasses[size]} flex max-h-[90vh] flex-col transition-all duration-200 ease-out ${isClosing ? "scale-[0.98] opacity-0" : "scale-100 opacity-100"}`,
+			className: `w-full rounded-2xl bg-[var(--dashboard-surface,#ffffff)] border border-[var(--dashboard-text-secondary,#64748B)]/10 dashboard-shadow-xl ${sizeClasses$2[size]} flex max-h-[90vh] flex-col transition-all duration-200 ease-out ${isClosing ? "scale-[0.98] opacity-0" : "scale-100 opacity-100"}`,
 			children: [
 				/* @__PURE__ */ jsxs("div", {
 					className: "flex h-fit items-center justify-between border-b border-[var(--dashboard-text-secondary,#64748B)]/10 px-6 py-4",
@@ -760,16 +751,16 @@ function FormField({ label, name, type = "text", value, onChange, error, require
 //#endregion
 //#region src/components/Tabs/index.tsx
-const cn$28 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$30 = (...classes) => classes.filter(Boolean).join(" ");
 function Tabs({ tabs, activeTab, onChange, variant = "underline", className }) {
 	if (variant === "pill") return /* @__PURE__ */ jsx("div", {
-		className: cn$28("flex flex-wrap gap-2", className),
+		className: cn$30("flex flex-wrap gap-2", className),
 		role: "tablist",
 		children: tabs.map((tab) => {
 			const isActive = activeTab === tab.id;
 			return /* @__PURE__ */ jsxs("button", {
 				onClick: () => onChange(tab.id),
-				className: cn$28("flex items-center gap-2 px-4 py-2 rounded-full text-sm font-medium transition-colors cursor-pointer", isActive ? "bg-[var(--dashboard-primary,#37a501)] text-white" : "bg-[var(--dashboard-text-secondary,#6b7280)]/10 text-[var(--dashboard-text-secondary,#6b7280)] hover:bg-[var(--dashboard-text-secondary,#6b7280)]/20"),
+				className: cn$30("flex items-center gap-2 px-4 py-2 rounded-full text-sm font-medium transition-colors cursor-pointer", isActive ? "bg-[var(--dashboard-primary,#37a501)] text-white" : "bg-[var(--dashboard-text-secondary,#6b7280)]/10 text-[var(--dashboard-text-secondary,#6b7280)] hover:bg-[var(--dashboard-text-secondary,#6b7280)]/20"),
 				role: "tab",
 				"aria-selected": isActive,
 				children: [
@@ -779,7 +770,7 @@ function Tabs({ tabs, activeTab, onChange, variant = "underline", className }) {
 					}),
 					tab.label,
 					tab.count !== void 0 && /* @__PURE__ */ jsx("span", {
-						className: cn$28("ml-1 text-xs rounded-full px-1.5 py-0.5", isActive ? "bg-white/20 text-white" : "bg-[var(--dashboard-text-secondary,#6b7280)]/10 text-[var(--dashboard-text-secondary,#6b7280)]"),
+						className: cn$30("ml-1 text-xs rounded-full px-1.5 py-0.5", isActive ? "bg-white/20 text-white" : "bg-[var(--dashboard-text-secondary,#6b7280)]/10 text-[var(--dashboard-text-secondary,#6b7280)]"),
 						children: tab.count
 					})
 				]
@@ -787,7 +778,7 @@ function Tabs({ tabs, activeTab, onChange, variant = "underline", className }) {
 		})
 	});
 	return /* @__PURE__ */ jsx("div", {
-		className: cn$28("border-b border-[var(--dashboard-text-secondary,#6b7280)]/20", className),
+		className: cn$30("border-b border-[var(--dashboard-text-secondary,#6b7280)]/20", className),
 		children: /* @__PURE__ */ jsx("nav", {
 			className: "flex gap-6",
 			"aria-label": "Tabs",
@@ -795,7 +786,7 @@ function Tabs({ tabs, activeTab, onChange, variant = "underline", className }) {
 				const isActive = activeTab === tab.id;
 				return /* @__PURE__ */ jsxs("button", {
 					onClick: () => onChange(tab.id),
-					className: cn$28("relative pb-3 px-1 text-sm font-medium transition-colors border-b-2 flex items-center gap-2 cursor-pointer", isActive ? "text-[var(--dashboard-primary,#37a501)] border-[var(--dashboard-primary,#37a501)]" : "text-[var(--dashboard-text-secondary,#6b7280)] hover:text-[var(--dashboard-text-primary,#2d2d2d)] border-transparent"),
+					className: cn$30("relative pb-3 px-1 text-sm font-medium transition-colors border-b-2 flex items-center gap-2 cursor-pointer", isActive ? "text-[var(--dashboard-primary,#37a501)] border-[var(--dashboard-primary,#37a501)]" : "text-[var(--dashboard-text-secondary,#6b7280)] hover:text-[var(--dashboard-text-primary,#2d2d2d)] border-transparent"),
 					role: "tab",
 					"aria-selected": isActive,
 					children: [
@@ -805,7 +796,7 @@ function Tabs({ tabs, activeTab, onChange, variant = "underline", className }) {
 						}),
 						tab.label,
 						tab.count !== void 0 && /* @__PURE__ */ jsx("span", {
-							className: cn$28("ml-1 text-xs rounded-full px-1.5 py-0.5", isActive ? "bg-[var(--dashboard-primary,#37a501)]/10 text-[var(--dashboard-primary,#37a501)]" : "bg-[var(--dashboard-text-secondary,#6b7280)]/10 text-[var(--dashboard-text-secondary,#6b7280)]"),
+							className: cn$30("ml-1 text-xs rounded-full px-1.5 py-0.5", isActive ? "bg-[var(--dashboard-primary,#37a501)]/10 text-[var(--dashboard-primary,#37a501)]" : "bg-[var(--dashboard-text-secondary,#6b7280)]/10 text-[var(--dashboard-text-secondary,#6b7280)]"),
 							children: tab.count
 						})
 					]
@@ -817,7 +808,7 @@ function Tabs({ tabs, activeTab, onChange, variant = "underline", className }) {
 //#endregion
 //#region src/components/DateRangePicker/index.tsx
-const cn$27 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$29 = (...classes) => classes.filter(Boolean).join(" ");
 const locales = {
 	pt: {
 		months: [
@@ -924,7 +915,7 @@ function DateRangePicker({ value, onChange, locale = "pt", className }) {
 	};
 	const days = getDaysInMonth(currentMonth);
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$27("w-64 bg-[var(--dashboard-surface,#ffffff)] rounded-lg p-4 shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20", className),
+		className: cn$29("w-64 bg-[var(--dashboard-surface,#ffffff)] rounded-lg p-4 shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20", className),
 		children: [/* @__PURE__ */ jsxs("div", {
 			className: "flex items-center justify-between mb-4",
 			children: [
@@ -962,9 +953,9 @@ function DateRangePicker({ value, onChange, locale = "pt", className }) {
 				const isSelected = isStart || isEnd;
 				return /* @__PURE__ */ jsxs("div", {
 					className: "relative h-8 w-8",
-					children: [value.start && value.end && (inRange || isStart || isEnd) && /* @__PURE__ */ jsx("div", { className: cn$27("absolute inset-0 bg-[var(--dashboard-text-secondary,#6b7280)]/10", isStart && "rounded-l-full", isEnd && "rounded-r-full") }), /* @__PURE__ */ jsx("button", {
+					children: [value.start && value.end && (inRange || isStart || isEnd) && /* @__PURE__ */ jsx("div", { className: cn$29("absolute inset-0 bg-[var(--dashboard-text-secondary,#6b7280)]/10", isStart && "rounded-l-full", isEnd && "rounded-r-full") }), /* @__PURE__ */ jsx("button", {
 						onClick: () => handleDayClick(day),
-						className: cn$27("relative h-8 w-8 flex items-center justify-center text-xs font-medium transition-colors z-10 rounded-full cursor-pointer", isSelected ? "bg-[var(--dashboard-primary,#37a501)] text-white hover:opacity-90" : "text-[var(--dashboard-text-primary,#2d2d2d)] hover:bg-[var(--dashboard-text-secondary,#6b7280)]/20"),
+						className: cn$29("relative h-8 w-8 flex items-center justify-center text-xs font-medium transition-colors z-10 rounded-full cursor-pointer", isSelected ? "bg-[var(--dashboard-primary,#37a501)] text-white hover:opacity-90" : "text-[var(--dashboard-text-primary,#2d2d2d)] hover:bg-[var(--dashboard-text-secondary,#6b7280)]/20"),
 						children: day
 					})]
 				}, day);
@@ -975,7 +966,7 @@ function DateRangePicker({ value, onChange, locale = "pt", className }) {
 //#endregion
 //#region src/components/Title/index.tsx
-const cn$26 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$28 = (...classes) => classes.filter(Boolean).join(" ");
 const defaultSizeByLevel = {
 	1: "text-2xl sm:text-3xl md:text-4xl lg:text-5xl",
 	2: "text-xl sm:text-2xl md:text-3xl lg:text-4xl",
@@ -1010,7 +1001,7 @@ function Title({ children, level = 1, size, weight = "bold", align = "left", col
 	const sizeClass = size ? customSizes[size] : defaultSizeByLevel[level];
 	const colorClass = color || "text-[var(--dashboard-text-primary,#2d2d2d)]";
 	return /* @__PURE__ */ jsx(Tag, {
-		className: cn$26(sizeClass, weightStyles[weight], alignStyles[align], colorClass, className),
+		className: cn$28(sizeClass, weightStyles[weight], alignStyles[align], colorClass, className),
 		...props,
 		children
 	});
@@ -1018,7 +1009,7 @@ function Title({ children, level = 1, size, weight = "bold", align = "left", col
 //#endregion
 //#region src/components/ToggleSwitch/index.tsx
-const cn$25 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$27 = (...classes) => classes.filter(Boolean).join(" ");
 const sizeConfig$1 = {
 	sm: {
 		track: "h-5 w-9",
@@ -1042,7 +1033,7 @@ const sizeConfig$1 = {
 function ToggleSwitch({ enabled, onChange, disabled = false, size = "md", label, className }) {
 	const config = sizeConfig$1[size];
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$25("inline-flex items-center gap-2", className),
+		className: cn$27("inline-flex items-center gap-2", className),
 		children: [/* @__PURE__ */ jsx("button", {
 			type: "button",
 			role: "switch",
@@ -1050,10 +1041,10 @@ function ToggleSwitch({ enabled, onChange, disabled = false, size = "md", label,
 			"aria-label": label,
 			disabled,
 			onClick: () => onChange(!enabled),
-			className: cn$25("relative inline-flex items-center rounded-full transition-colors outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--dashboard-primary,#37a501)]", config.track, enabled ? "bg-[var(--dashboard-primary,#37a501)]" : "bg-[var(--dashboard-text-secondary,#6b7280)]/30", disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"),
-			children: /* @__PURE__ */ jsx("span", { className: cn$25("inline-block transform rounded-full bg-white shadow-sm transition-transform", config.thumb, enabled ? config.translateOn : config.translateOff) })
+			className: cn$27("relative inline-flex items-center rounded-full transition-colors outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-[var(--dashboard-primary,#37a501)]", config.track, enabled ? "bg-[var(--dashboard-primary,#37a501)]" : "bg-[var(--dashboard-text-secondary,#6b7280)]/30", disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"),
+			children: /* @__PURE__ */ jsx("span", { className: cn$27("inline-block transform rounded-full bg-white shadow-sm transition-transform", config.thumb, enabled ? config.translateOn : config.translateOff) })
 		}), label && /* @__PURE__ */ jsx("span", {
-			className: cn$25("text-sm text-[var(--dashboard-text-primary,#2d2d2d)]", disabled && "opacity-50"),
+			className: cn$27("text-sm text-[var(--dashboard-text-primary,#2d2d2d)]", disabled && "opacity-50"),
 			children: label
 		})]
 	});
@@ -1061,7 +1052,7 @@ function ToggleSwitch({ enabled, onChange, disabled = false, size = "md", label,
 //#endregion
 //#region src/components/BadgeStatus/index.tsx
-const cn$24 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$26 = (...classes) => classes.filter(Boolean).join(" ");
 const variantStyles = {
 	success: {
 		color: "text-[var(--dashboard-status-success,#10B981)]",
@@ -1092,7 +1083,7 @@ function BadgeStatus({ label, variant = "neutral", color, bgColor, size = "md",
 	const styles = variantStyles[variant];
 	const useCustomColors = color || bgColor;
 	return /* @__PURE__ */ jsx("span", {
-		className: cn$24("inline-flex items-center rounded-full font-medium whitespace-nowrap", sizeClasses$1[size], !useCustomColors && styles.color, !useCustomColors && styles.bgColor, className),
+		className: cn$26("inline-flex items-center rounded-full font-medium whitespace-nowrap", sizeClasses$1[size], !useCustomColors && styles.color, !useCustomColors && styles.bgColor, className),
 		style: useCustomColors ? {
 			color: color || void 0,
 			backgroundColor: bgColor || void 0
@@ -1103,7 +1094,7 @@ function BadgeStatus({ label, variant = "neutral", color, bgColor, size = "md",
 //#endregion
 //#region src/components/Sidebar/index.tsx
-const cn$23 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$25 = (...classes) => classes.filter(Boolean).join(" ");
 function DefaultLink({ href, className, children }) {
 	return /* @__PURE__ */ jsx("a", {
 		href,
@@ -1179,7 +1170,7 @@ function Sidebar({ menuItems, logo, collapsedLogo, currentPath, linkComponent: L
 		const isChildActive = item.children?.some((c) => currentPath === c.href);
 		if (hasChildren) return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("button", {
 			onClick: () => toggleExpand(item.id),
-			className: cn$23("w-full flex items-center px-4 py-3 rounded-lg text-sm font-medium cursor-pointer", collapsed && !mobile ? "justify-center" : "justify-start", isChildActive ? "text-[var(--dashboard-sidebar-active-text,#ff521d)]" : "text-[var(--dashboard-sidebar-text,#403f52)] hover:bg-[var(--dashboard-primary,#ff521d)]/10"),
+			className: cn$25("w-full flex items-center px-4 py-3 rounded-lg text-sm font-medium cursor-pointer", collapsed && !mobile ? "justify-center" : "justify-start", isChildActive ? "text-[var(--dashboard-sidebar-active-text,#ff521d)]" : "text-[var(--dashboard-sidebar-text,#403f52)] hover:bg-[var(--dashboard-primary,#ff521d)]/10"),
 			style: { transition: "background-color 200ms, color 200ms" },
 			title: collapsed && !mobile ? item.label : void 0,
 			children: [/* @__PURE__ */ jsx(Icon, {
@@ -1194,7 +1185,7 @@ function Sidebar({ menuItems, logo, collapsedLogo, currentPath, linkComponent: L
 				children: item.label
 			}), /* @__PURE__ */ jsx(ChevronRight, {
 				size: 14,
-				className: cn$23("ml-auto flex-shrink-0 transition-transform duration-200", isExpanded ? "rotate-90" : "")
+				className: cn$25("ml-auto flex-shrink-0 transition-transform duration-200", isExpanded ? "rotate-90" : "")
 			})] })]
 		}), (!collapsed || mobile) && /* @__PURE__ */ jsx("div", {
 			className: "overflow-hidden transition-all duration-200 ml-7 border-l-2 border-[var(--dashboard-sidebar-border,#e0dfe3)]",
@@ -1206,7 +1197,7 @@ function Sidebar({ menuItems, logo, collapsedLogo, currentPath, linkComponent: L
 					href: child.href,
 					className: "block",
 					children: /* @__PURE__ */ jsxs("div", {
-						className: cn$23("w-full flex items-center pl-4 pr-4 py-2 rounded-r-lg text-[13px] cursor-pointer", childActive ? "text-[var(--dashboard-sidebar-active-text,#ff521d)] font-semibold border-l-2 border-[var(--dashboard-primary,#ff521d)] -ml-[2px]" : "text-[var(--dashboard-sidebar-text,#403f52)] hover:text-[var(--dashboard-sidebar-active-text,#ff521d)]"),
+						className: cn$25("w-full flex items-center pl-4 pr-4 py-2 rounded-r-lg text-[13px] cursor-pointer", childActive ? "text-[var(--dashboard-sidebar-active-text,#ff521d)] font-semibold border-l-2 border-[var(--dashboard-primary,#ff521d)] -ml-[2px]" : "text-[var(--dashboard-sidebar-text,#403f52)] hover:text-[var(--dashboard-sidebar-active-text,#ff521d)]"),
 						style: { transition: "background-color 200ms, color 200ms" },
 						children: [/* @__PURE__ */ jsx(ChildIcon, {
 							size: 15,
@@ -1223,7 +1214,7 @@ function Sidebar({ menuItems, logo, collapsedLogo, currentPath, linkComponent: L
 			href: item.href,
 			className: "block",
 			children: /* @__PURE__ */ jsxs("div", {
-				className: cn$23("w-full flex items-center px-4 py-3 rounded-lg text-sm font-medium cursor-pointer", collapsed && !mobile ? "justify-center" : "justify-start", isActive ? "bg-[var(--dashboard-primary,#ff521d)]/25 text-[var(--dashboard-sidebar-active-text,#ff521d)]" : "text-[var(--dashboard-sidebar-text,#403f52)] hover:bg-[var(--dashboard-primary,#ff521d)]/10"),
+				className: cn$25("w-full flex items-center px-4 py-3 rounded-lg text-sm font-medium cursor-pointer", collapsed && !mobile ? "justify-center" : "justify-start", isActive ? "bg-[var(--dashboard-primary,#ff521d)]/25 text-[var(--dashboard-sidebar-active-text,#ff521d)]" : "text-[var(--dashboard-sidebar-text,#403f52)] hover:bg-[var(--dashboard-primary,#ff521d)]/10"),
 				style: { transition: "background-color 200ms, color 200ms" },
 				title: collapsed && !mobile ? item.label : void 0,
 				children: [/* @__PURE__ */ jsx(Icon, {
@@ -1317,7 +1308,7 @@ function Sidebar({ menuItems, logo, collapsedLogo, currentPath, linkComponent: L
 			})
 		})]
 	}), /* @__PURE__ */ jsxs("aside", {
-		className: cn$23("hidden xl:flex xl:flex-col xl:fixed xl:left-0 xl:top-0 xl:h-screen bg-[var(--dashboard-sidebar-bg,#f0f0f0)] border-r border-[var(--dashboard-sidebar-border,#e0dfe3)] overflow-visible", isCollapsed ? "xl:w-[109px]" : "xl:w-[280px]", className),
+		className: cn$25("hidden xl:flex xl:flex-col xl:fixed xl:left-0 xl:top-0 xl:h-screen bg-[var(--dashboard-sidebar-bg,#f0f0f0)] border-r border-[var(--dashboard-sidebar-border,#e0dfe3)] overflow-visible", isCollapsed ? "xl:w-[109px]" : "xl:w-[280px]", className),
 		style: { transition: `width 400ms ${cubicBezier}` },
 		children: [onToggleCollapse && /* @__PURE__ */ jsxs("button", {
 			onClick: onToggleCollapse,
@@ -1391,7 +1382,7 @@ function Sidebar({ menuItems, logo, collapsedLogo, currentPath, linkComponent: L
 					children: [
 						user && /* @__PURE__ */ jsxs("button", {
 							onClick: onUserClick,
-							className: cn$23("w-full flex items-center px-4 py-3 rounded-lg bg-[var(--dashboard-primary,#ff521d)]/5 hover:bg-[var(--dashboard-primary,#ff521d)]/10 transition-colors cursor-pointer", isCollapsed ? "justify-center" : "justify-start"),
+							className: cn$25("w-full flex items-center px-4 py-3 rounded-lg bg-[var(--dashboard-primary,#ff521d)]/5 hover:bg-[var(--dashboard-primary,#ff521d)]/10 transition-colors cursor-pointer", isCollapsed ? "justify-center" : "justify-start"),
 							title: isCollapsed ? `${user.subtitle ? user.subtitle + " - " : ""}${user.name}` : void 0,
 							children: [/* @__PURE__ */ jsx("div", {
 								className: "flex items-center justify-center w-8 h-8 rounded-full bg-[var(--dashboard-primary,#ff521d)]/30 text-[var(--dashboard-sidebar-text,#403f52)] flex-shrink-0",
@@ -1424,7 +1415,7 @@ function Sidebar({ menuItems, logo, collapsedLogo, currentPath, linkComponent: L
 						footerItems?.map((item) => renderMenuItem(item, isCollapsed, false)),
 						onLogout && /* @__PURE__ */ jsxs("button", {
 							onClick: onLogout,
-							className: cn$23("w-full flex items-center px-4 py-3 rounded-lg text-sm font-medium cursor-pointer text-[var(--dashboard-sidebar-text,#403f52)] hover:bg-[var(--dashboard-primary,#ff521d)]/10", isCollapsed ? "justify-center" : "justify-start"),
+							className: cn$25("w-full flex items-center px-4 py-3 rounded-lg text-sm font-medium cursor-pointer text-[var(--dashboard-sidebar-text,#403f52)] hover:bg-[var(--dashboard-primary,#ff521d)]/10", isCollapsed ? "justify-center" : "justify-start"),
 							style: { transition: "background-color 200ms" },
 							title: isCollapsed ? logoutLabel : void 0,
 							children: [/* @__PURE__ */ jsx(LogOut, {
@@ -1452,7 +1443,7 @@ function Sidebar({ menuItems, logo, collapsedLogo, currentPath, linkComponent: L
 //#endregion
 //#region src/components/ThemeSwitcher/index.tsx
-const cn$22 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$24 = (...classes) => classes.filter(Boolean).join(" ");
 const modes = [
 	{
 		value: "light",
@@ -1472,11 +1463,11 @@ const modes = [
 ];
 function ThemeSwitcher({ mode, onModeChange, className }) {
 	return /* @__PURE__ */ jsx("div", {
-		className: cn$22("inline-flex items-center gap-1 rounded-lg bg-[var(--dashboard-background,#f2f2f2)] p-1", className),
+		className: cn$24("inline-flex items-center gap-1 rounded-lg bg-[var(--dashboard-background,#f2f2f2)] p-1", className),
 		children: modes.map(({ value, icon: Icon, label }) => /* @__PURE__ */ jsxs("button", {
 			type: "button",
 			onClick: () => onModeChange(value),
-			className: cn$22("flex cursor-pointer items-center gap-1.5 rounded-md px-3 py-1.5 text-xs font-medium transition-colors", mode === value ? "bg-[var(--dashboard-surface,#ffffff)] text-[var(--dashboard-text-primary,#2d2d2d)] shadow-sm" : "text-[var(--dashboard-text-secondary,#6b7280)] hover:text-[var(--dashboard-text-primary,#2d2d2d)]"),
+			className: cn$24("flex cursor-pointer items-center gap-1.5 rounded-md px-3 py-1.5 text-xs font-medium transition-colors", mode === value ? "bg-[var(--dashboard-surface,#ffffff)] text-[var(--dashboard-text-primary,#2d2d2d)] shadow-sm" : "text-[var(--dashboard-text-secondary,#6b7280)] hover:text-[var(--dashboard-text-primary,#2d2d2d)]"),
 			title: label,
 			children: [/* @__PURE__ */ jsx(Icon, { size: 14 }), /* @__PURE__ */ jsx("span", { children: label })]
 		}, value))
@@ -1485,7 +1476,7 @@ function ThemeSwitcher({ mode, onModeChange, className }) {
 //#endregion
 //#region src/components/KPICard/index.tsx
-const cn$21 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$23 = (...classes) => classes.filter(Boolean).join(" ");
 function formatValue(value, format) {
 	switch (format) {
 		case "currency": return new Intl.NumberFormat("pt-BR", {
@@ -1515,7 +1506,7 @@ function KPICard({ title, value, variation, trend, format = "number", benchmark,
 	if (isLoading) return /* @__PURE__ */ jsx(KPICardSkeleton, { className });
 	const trendConfig = trendConfigs[trend];
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$21("h-full w-full bg-[var(--dashboard-surface,#ffffff)] rounded-xl p-6 border border-[var(--dashboard-text-secondary,#64748B)]/12 transition-all duration-200 ease-out dashboard-shadow-sm hover:dashboard-shadow-md flex flex-col", className),
+		className: cn$23("h-full w-full bg-[var(--dashboard-surface,#ffffff)] rounded-xl p-6 border border-[var(--dashboard-text-secondary,#64748B)]/12 transition-all duration-200 ease-out dashboard-shadow-sm hover:dashboard-shadow-md flex flex-col", className),
 		children: [/* @__PURE__ */ jsxs("div", {
 			className: "flex justify-between items-start mb-4",
 			children: [/* @__PURE__ */ jsx("h3", {
@@ -1532,7 +1523,7 @@ function KPICard({ title, value, variation, trend, format = "number", benchmark,
 				className: "text-3xl font-bold text-[var(--dashboard-text-primary,#0F172A)] whitespace-nowrap tracking-tight",
 				children: formatValue(value, format)
 			}), /* @__PURE__ */ jsxs("div", {
-				className: cn$21("inline-flex items-center gap-1 px-2 py-1 rounded-full flex-shrink-0 mb-1", trendConfig.color),
+				className: cn$23("inline-flex items-center gap-1 px-2 py-1 rounded-full flex-shrink-0 mb-1", trendConfig.color),
 				children: [/* @__PURE__ */ jsx("span", {
 					className: "text-sm",
 					children: trendConfig.icon
@@ -1546,7 +1537,7 @@ function KPICard({ title, value, variation, trend, format = "number", benchmark,
 }
 function KPICardSkeleton({ className }) {
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$21("h-full bg-[var(--dashboard-surface,#ffffff)] rounded-xl p-6 border border-[var(--dashboard-text-secondary,#64748B)]/12 dashboard-shadow-sm animate-pulse flex flex-col", className),
+		className: cn$23("h-full bg-[var(--dashboard-surface,#ffffff)] rounded-xl p-6 border border-[var(--dashboard-text-secondary,#64748B)]/12 dashboard-shadow-sm animate-pulse flex flex-col", className),
 		children: [/* @__PURE__ */ jsx("div", { className: "h-3 bg-[var(--dashboard-text-secondary,#64748B)]/10 rounded w-2/3 mb-4" }), /* @__PURE__ */ jsxs("div", {
 			className: "flex items-end gap-3 flex-1",
 			children: [/* @__PURE__ */ jsx("div", { className: "h-8 bg-[var(--dashboard-text-secondary,#64748B)]/10 rounded w-1/2" }), /* @__PURE__ */ jsx("div", { className: "h-5 bg-[var(--dashboard-text-secondary,#64748B)]/10 rounded-full w-1/4" })]
@@ -1556,13 +1547,13 @@ function KPICardSkeleton({ className }) {
 //#endregion
 //#region src/components/PageLayout/index.tsx
-const cn$20 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$22 = (...classes) => classes.filter(Boolean).join(" ");
 function PageLayout({ title, description, headerActions, children, contentPadding = true, sidebar, sidebarCollapsed = false, sidebarWidth = 280, sidebarCollapsedWidth = 109, className }) {
 	const marginLeft = sidebar ? sidebarCollapsed ? `max(0px, ${sidebarCollapsedWidth}px)` : `max(0px, ${sidebarWidth}px)` : "0px";
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$20("min-h-screen bg-[var(--dashboard-background,#f2f2f2)]", className),
+		className: cn$22("min-h-screen bg-[var(--dashboard-background,#f2f2f2)]", className),
 		children: [sidebar, /* @__PURE__ */ jsxs("main", {
-			className: cn$20("pt-16 xl:pt-0", !sidebar && "pt-0"),
+			className: cn$22("pt-16 xl:pt-0", !sidebar && "pt-0"),
 			style: {
 				marginLeft,
 				transition: "margin-left 400ms cubic-bezier(0.4, 0, 0.2, 1)"
@@ -1600,7 +1591,7 @@ function PageLayout({ title, description, headerActions, children, contentPaddin
 //#endregion
 //#region src/components/ComparisonLineChart/index.tsx
 Chart.register(CategoryScale, LinearScale, PointElement, LineElement, Title$1, Tooltip$1, Legend, Filler);
-const cn$19 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$21 = (...classes) => classes.filter(Boolean).join(" ");
 function ComparisonLineChart({ labels, currentPeriodData, previousPeriodData, currentPeriodLabel = "Período atual", previousPeriodLabel = "Período anterior", title, color, height = 300, className }) {
 	const primaryColor = color || (typeof document !== "undefined" ? getComputedStyle(document.documentElement).getPropertyValue("--dashboard-primary").trim() : "") || "#37a501";
 	const data = {
@@ -1694,7 +1685,7 @@ function ComparisonLineChart({ labels, currentPeriodData, previousPeriodData, cu
 		}
 	};
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$19("bg-[var(--dashboard-surface,#ffffff)] rounded-lg shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20 p-6", className),
+		className: cn$21("bg-[var(--dashboard-surface,#ffffff)] rounded-lg shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20 p-6", className),
 		children: [title && /* @__PURE__ */ jsx("h3", {
 			className: "text-base font-semibold mb-4 text-[var(--dashboard-text-primary,#2d2d2d)]",
 			children: title
@@ -1711,7 +1702,7 @@ function ComparisonLineChart({ labels, currentPeriodData, previousPeriodData, cu
 //#endregion
 //#region src/components/HorizontalBarChart/index.tsx
 Chart.register(CategoryScale, LinearScale, BarElement, Title$1, Tooltip$1, Legend);
-const cn$18 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$20 = (...classes) => classes.filter(Boolean).join(" ");
 function HorizontalBarChart({ labels, datasets, tabs, title, titleIcon, color, valueLabel = "itens", valueLabelSingular, bestItemLabel = "Melhor item", className }) {
 	const [activeTab, setActiveTab] = useState((tabs ? tabs.map((t) => t.id) : Object.keys(datasets))[0]);
 	const [isMobile, setIsMobile] = useState(false);
@@ -1786,7 +1777,7 @@ function HorizontalBarChart({ labels, datasets, tabs, title, titleIcon, color, v
 		}
 	};
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$18("bg-[var(--dashboard-surface,#ffffff)] rounded-lg shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20 p-5 sm:p-6 min-h-[850px] sm:h-full flex flex-col", className),
+		className: cn$20("bg-[var(--dashboard-surface,#ffffff)] rounded-lg shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20 p-5 sm:p-6 min-h-[850px] sm:h-full flex flex-col", className),
 		children: [
 			title && /* @__PURE__ */ jsxs("div", {
 				className: "flex items-center gap-2 mb-4",
@@ -1799,7 +1790,7 @@ function HorizontalBarChart({ labels, datasets, tabs, title, titleIcon, color, v
 				className: "flex gap-2 mb-4 flex-wrap",
 				children: tabs.map((tab) => /* @__PURE__ */ jsx("button", {
 					onClick: () => setActiveTab(tab.id),
-					className: cn$18("px-3.5 py-2 sm:px-4 sm:py-2 rounded-full text-sm font-medium transition-colors whitespace-nowrap cursor-pointer", activeTab === tab.id ? "bg-[var(--dashboard-primary,#37a501)] text-white" : "bg-[var(--dashboard-text-secondary,#6b7280)]/10 text-[var(--dashboard-text-secondary,#6b7280)] hover:bg-[var(--dashboard-text-secondary,#6b7280)]/20"),
+					className: cn$20("px-3.5 py-2 sm:px-4 sm:py-2 rounded-full text-sm font-medium transition-colors whitespace-nowrap cursor-pointer", activeTab === tab.id ? "bg-[var(--dashboard-primary,#37a501)] text-white" : "bg-[var(--dashboard-text-secondary,#6b7280)]/10 text-[var(--dashboard-text-secondary,#6b7280)] hover:bg-[var(--dashboard-text-secondary,#6b7280)]/20"),
 					children: tab.label
 				}, tab.id))
 			}),
@@ -1838,7 +1829,7 @@ function HorizontalBarChart({ labels, datasets, tabs, title, titleIcon, color, v
 //#endregion
 //#region src/components/VerticalBarChart/index.tsx
 Chart.register(CategoryScale, LinearScale, BarElement, Title$1, Tooltip$1, Legend);
-const cn$17 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$19 = (...classes) => classes.filter(Boolean).join(" ");
 function VerticalBarChart({ labels, data: values, title, titleIcon, color, valueLabel = "itens", valueLabelSingular, bestItemLabel = "Melhor item", labelMaxChars = 3, className }) {
 	const maxValue = Math.max(...values);
 	const bestLabel = labels[values.indexOf(maxValue)];
@@ -1901,7 +1892,7 @@ function VerticalBarChart({ labels, data: values, title, titleIcon, color, value
 		}
 	};
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$17("bg-[var(--dashboard-surface,#ffffff)] rounded-lg shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20 p-6 flex-1 flex flex-col", className),
+		className: cn$19("bg-[var(--dashboard-surface,#ffffff)] rounded-lg shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20 p-6 flex-1 flex flex-col", className),
 		children: [
 			title && /* @__PURE__ */ jsxs("div", {
 				className: "flex items-center gap-2 mb-4",
@@ -1957,7 +1948,7 @@ const DEFAULT_COLORS = [
 	"#EA580C",
 	"#4F46E5"
 ];
-const cn$16 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$18 = (...classes) => classes.filter(Boolean).join(" ");
 function DoughnutChart({ items, title, titleIcon, centerLabel, centerValue, showLegend = true, formatValue, cutout = 65, height = 240, className }) {
 	const total = items.reduce((sum, item) => sum + item.value, 0);
 	const format = formatValue || ((v) => String(v));
@@ -1997,7 +1988,7 @@ function DoughnutChart({ items, title, titleIcon, centerLabel, centerValue, show
 		}
 	};
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$16("bg-[var(--dashboard-surface,#ffffff)] rounded-lg shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20 p-6", className),
+		className: cn$18("bg-[var(--dashboard-surface,#ffffff)] rounded-lg shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20 p-6", className),
 		children: [title && /* @__PURE__ */ jsxs("div", {
 			className: "flex items-center gap-2 mb-4",
 			children: [titleIcon, /* @__PURE__ */ jsx("h3", {
@@ -2005,7 +1996,7 @@ function DoughnutChart({ items, title, titleIcon, centerLabel, centerValue, show
 				children: title
 			})]
 		}), /* @__PURE__ */ jsxs("div", {
-			className: cn$16("flex items-center", showLegend ? "gap-6" : "justify-center"),
+			className: cn$18("flex items-center", showLegend ? "gap-6" : "justify-center"),
 			children: [/* @__PURE__ */ jsxs("div", {
 				className: "relative flex-shrink-0",
 				style: {
@@ -2058,7 +2049,7 @@ function DoughnutChart({ items, title, titleIcon, centerLabel, centerValue, show
 //#endregion
 //#region src/components/ProgressBarList/index.tsx
-const cn$15 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$17 = (...classes) => classes.filter(Boolean).join(" ");
 function ProgressBarList({ items, title, titleIcon, color, valueLabel = "itens", valueLabelSingular, sortByValue = true, formatValue, className }) {
 	const sortedItems = sortByValue ? [...items].sort((a, b) => b.value - a.value) : items;
 	const maxValue = Math.max(...items.map((i) => i.value));
@@ -2067,7 +2058,7 @@ function ProgressBarList({ items, title, titleIcon, color, valueLabel = "itens",
 	const defaultFormat = (v) => `${v} ${v === 1 ? singular : valueLabel}`;
 	const fmt = formatValue || defaultFormat;
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$15("bg-[var(--dashboard-surface,#ffffff)] rounded-lg shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20 p-6 flex-1 flex flex-col", className),
+		className: cn$17("bg-[var(--dashboard-surface,#ffffff)] rounded-lg shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20 p-6 flex-1 flex flex-col", className),
 		children: [title && /* @__PURE__ */ jsxs("div", {
 			className: "flex items-center gap-2 mb-4",
 			children: [titleIcon, /* @__PURE__ */ jsx("h3", {
@@ -2116,7 +2107,7 @@ function ProgressBarList({ items, title, titleIcon, color, valueLabel = "itens",
 //#endregion
 //#region src/components/MetricPanel/index.tsx
 Chart.register(CategoryScale, LinearScale, PointElement, LineElement, Title$1, Tooltip$1, Legend, Filler);
-const cn$14 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$16 = (...classes) => classes.filter(Boolean).join(" ");
 function MetricPanel({ title, titleIcon: TitleIcon, metrics, chartData, color, secondaryColor, onActionClick, actionLabel, isLoading = false, className }) {
 	const [selectedMetricKey, setSelectedMetricKey] = useState(metrics[0]?.key);
 	const [isMobile, setIsMobile] = useState(false);
@@ -2214,7 +2205,7 @@ function MetricPanel({ title, titleIcon: TitleIcon, metrics, chartData, color, s
 		}
 	};
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$14("bg-[var(--dashboard-surface,#ffffff)] rounded-lg shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20", className),
+		className: cn$16("bg-[var(--dashboard-surface,#ffffff)] rounded-lg shadow-sm border border-[var(--dashboard-text-secondary,#6b7280)]/20", className),
 		style: { overflow: "visible" },
 		children: [
 			/* @__PURE__ */ jsxs("div", {
@@ -2255,7 +2246,7 @@ function MetricPanel({ title, titleIcon: TitleIcon, metrics, chartData, color, s
 						const Icon = metric.icon;
 						return /* @__PURE__ */ jsxs("button", {
 							onClick: () => setSelectedMetricKey(metric.key),
-							className: cn$14("flex items-center gap-2 px-4 md:px-6 py-2 rounded-full text-sm font-medium transition-colors cursor-pointer", selectedMetricKey === metric.key ? "bg-[var(--dashboard-surface,#ffffff)] border-2 text-[var(--dashboard-primary,#37a501)]" : "bg-[var(--dashboard-surface,#ffffff)] border border-[var(--dashboard-text-secondary,#6b7280)]/30 text-[var(--dashboard-text-secondary,#6b7280)] hover:border-[var(--dashboard-text-secondary,#6b7280)]/50"),
+							className: cn$16("flex items-center gap-2 px-4 md:px-6 py-2 rounded-full text-sm font-medium transition-colors cursor-pointer", selectedMetricKey === metric.key ? "bg-[var(--dashboard-surface,#ffffff)] border-2 text-[var(--dashboard-primary,#37a501)]" : "bg-[var(--dashboard-surface,#ffffff)] border border-[var(--dashboard-text-secondary,#6b7280)]/30 text-[var(--dashboard-text-secondary,#6b7280)] hover:border-[var(--dashboard-text-secondary,#6b7280)]/50"),
 							style: selectedMetricKey === metric.key ? {
 								borderColor: primaryColor,
 								color: primaryColor
@@ -2303,10 +2294,10 @@ function MetricPanel({ title, titleIcon: TitleIcon, metrics, chartData, color, s
 //#endregion
 //#region src/components/FilterBar/index.tsx
-const cn$13 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$15 = (...classes) => classes.filter(Boolean).join(" ");
 function FilterBar({ searchValue, onSearchChange, searchPlaceholder = "Buscar...", children, actions, className }) {
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$13("flex flex-col gap-3 sm:flex-row sm:items-center sm:flex-wrap", className),
+		className: cn$15("flex flex-col gap-3 sm:flex-row sm:items-center sm:flex-wrap", className),
 		children: [
 			onSearchChange !== void 0 && /* @__PURE__ */ jsx("div", {
 				className: "flex-1 min-w-[200px]",
@@ -2346,7 +2337,7 @@ function FilterBar({ searchValue, onSearchChange, searchPlaceholder = "Buscar...
 //#endregion
 //#region src/components/Checkbox/index.tsx
-const cn$12 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$14 = (...classes) => classes.filter(Boolean).join(" ");
 const sizeConfig = {
 	sm: {
 		box: 16,
@@ -2394,7 +2385,7 @@ function Checkbox({ name, id, label, checked = false, onChange, disabled = false
 	const resolvedColor = primaryColor || "var(--dashboard-primary, #37A501)";
 	return /* @__PURE__ */ jsxs("label", {
 		htmlFor: inputId,
-		className: cn$12("inline-flex items-center cursor-pointer select-none", disabled && "opacity-50 cursor-not-allowed", className),
+		className: cn$14("inline-flex items-center cursor-pointer select-none", disabled && "opacity-50 cursor-not-allowed", className),
 		style: { gap: cfg.gap },
 		children: [
 			/* @__PURE__ */ jsx("input", {
@@ -2445,7 +2436,7 @@ function Checkbox({ name, id, label, checked = false, onChange, disabled = false
 //#endregion
 //#region src/components/AuthLayout/index.tsx
-const cn$11 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$13 = (...classes) => classes.filter(Boolean).join(" ");
 /** Resolves a CSS color value (including var() references) to a computed hex/rgb string */
 function useResolvedColor(cssValue) {
 	const [resolved, setResolved] = useState(cssValue);
@@ -2612,7 +2603,7 @@ function AuthLayout({ logo, title, subtitle, error, success, fields, values, onF
 		if (link.onClick) return /* @__PURE__ */ jsx("button", {
 			type: "button",
 			onClick: link.onClick,
-			className: cn$11("bg-transparent border-none cursor-pointer hover:opacity-80 text-sm font-semibold p-0 transition-colors", extraClass),
+			className: cn$13("bg-transparent border-none cursor-pointer hover:opacity-80 text-sm font-semibold p-0 transition-colors", extraClass),
 			style,
 			children: link.label
 		});
@@ -2620,13 +2611,13 @@ function AuthLayout({ logo, title, subtitle, error, success, fields, values, onF
 			href: link.href,
 			target: link.target,
 			rel: link.target === "_blank" ? "noopener noreferrer" : void 0,
-			className: cn$11("hover:opacity-80 text-sm font-semibold transition-colors", extraClass),
+			className: cn$13("hover:opacity-80 text-sm font-semibold transition-colors", extraClass),
 			style,
 			children: link.label
 		});
 	}
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$11("fixed inset-0 flex select-none overflow-hidden", className),
+		className: cn$13("fixed inset-0 flex select-none overflow-hidden", className),
 		style: bgCss,
 		children: [
 			branding && branding.logos.length > 0 && /* @__PURE__ */ jsx("div", {
@@ -2909,7 +2900,7 @@ function CodeInput({ length = 6, value, onChange, disabled = false, error = fals
 //#endregion
 //#region src/components/Skeleton/index.tsx
-const cn$10 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$12 = (...classes) => classes.filter(Boolean).join(" ");
 function Skeleton({ variant = "text", width, height, animate = true, className, lines = 1 }) {
 	const baseStyles = "bg-[var(--dashboard-text-secondary,#6b7280)]/10 relative overflow-hidden";
 	const shimmerStyles = animate ? "after:absolute after:inset-0 after:bg-gradient-to-r after:from-transparent after:via-[var(--dashboard-text-secondary,#6b7280)]/5 after:to-transparent dashboard-animate-shimmer after:content-['']" : "";
@@ -2928,9 +2919,9 @@ function Skeleton({ variant = "text", width, height, animate = true, className,
 	}
 	if (variant === "card" && !height) style.height = "120px";
 	if (variant === "text" && lines > 1) return /* @__PURE__ */ jsx("div", {
-		className: cn$10("flex flex-col gap-2", className),
+		className: cn$12("flex flex-col gap-2", className),
 		children: Array.from({ length: lines }).map((_, i) => /* @__PURE__ */ jsx("div", {
-			className: cn$10(baseStyles, shimmerStyles, variantStyles.text),
+			className: cn$12(baseStyles, shimmerStyles, variantStyles.text),
 			style: {
 				...style,
 				width: i === lines - 1 ? "75%" : style.width || "100%"
@@ -2938,14 +2929,14 @@ function Skeleton({ variant = "text", width, height, animate = true, className,
 		}, i))
 	});
 	return /* @__PURE__ */ jsx("div", {
-		className: cn$10(baseStyles, shimmerStyles, variantStyles[variant], className),
+		className: cn$12(baseStyles, shimmerStyles, variantStyles[variant], className),
 		style
 	});
 }
 //#endregion
 //#region src/components/DataGrid/index.tsx
-const cn$9 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$11 = (...classes) => classes.filter(Boolean).join(" ");
 function SortIcon({ sorted }) {
 	if (sorted === "asc") return /* @__PURE__ */ jsx(ArrowUp, { className: "h-3.5 w-3.5" });
 	if (sorted === "desc") return /* @__PURE__ */ jsx(ArrowDown, { className: "h-3.5 w-3.5" });
@@ -3000,7 +2991,7 @@ function VirtualRows({ table, rowHeight, onRowClick, compact }) {
 					className: "bg-[var(--dashboard-text-secondary,#6b7280)]/5 sticky top-0 z-10",
 					children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx("th", {
 						scope: "col",
-						className: cn$9("text-left text-xs font-semibold text-[var(--dashboard-text-secondary,#6b7280)] uppercase tracking-wider", compact ? "px-4 py-2" : "px-6 py-3", header.column.getCanSort() && "cursor-pointer select-none"),
+						className: cn$11("text-left text-xs font-semibold text-[var(--dashboard-text-secondary,#6b7280)] uppercase tracking-wider", compact ? "px-4 py-2" : "px-6 py-3", header.column.getCanSort() && "cursor-pointer select-none"),
 						style: { width: header.getSize() },
 						onClick: header.column.getToggleSortingHandler(),
 						children: /* @__PURE__ */ jsxs("div", {
@@ -3015,10 +3006,10 @@ function VirtualRows({ table, rowHeight, onRowClick, compact }) {
 					}),
 					visibleRows.map((row) => /* @__PURE__ */ jsx("tr", {
 						onClick: () => onRowClick?.(row.original),
-						className: cn$9("hover:bg-[var(--dashboard-text-secondary,#6b7280)]/5 transition-colors", onRowClick && "cursor-pointer", row.getIsSelected() && "bg-[var(--dashboard-primary,#37a501)]/5"),
+						className: cn$11("hover:bg-[var(--dashboard-text-secondary,#6b7280)]/5 transition-colors", onRowClick && "cursor-pointer", row.getIsSelected() && "bg-[var(--dashboard-primary,#37a501)]/5"),
 						style: { height: rowHeight },
 						children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx("td", {
-							className: cn$9(cellPadding, "text-sm whitespace-nowrap"),
+							className: cn$11(cellPadding, "text-sm whitespace-nowrap"),
 							children: flexRender(cell.column.columnDef.cell, cell.getContext())
 						}, cell.id))
 					}, row.id)),
@@ -3097,7 +3088,7 @@ function DataGrid({ columns, data, isLoading = false, skeletonRows = 5, sorting:
 	const cellPadding = compact ? "px-4 py-2" : "px-6 py-4";
 	const headerPadding = compact ? "px-4 py-2" : "px-6 py-3";
 	if (enableVirtualization) return /* @__PURE__ */ jsx("div", {
-		className: cn$9("overflow-hidden rounded-lg bg-[var(--dashboard-surface,#ffffff)] shadow-sm", bordered && "border border-[var(--dashboard-text-secondary,#6b7280)]/20", className),
+		className: cn$11("overflow-hidden rounded-lg bg-[var(--dashboard-surface,#ffffff)] shadow-sm", bordered && "border border-[var(--dashboard-text-secondary,#6b7280)]/20", className),
 		children: /* @__PURE__ */ jsx(VirtualRows, {
 			table,
 			rowHeight,
@@ -3106,16 +3097,16 @@ function DataGrid({ columns, data, isLoading = false, skeletonRows = 5, sorting:
 		})
 	});
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$9("overflow-hidden rounded-lg bg-[var(--dashboard-surface,#ffffff)] shadow-sm", bordered && "border border-[var(--dashboard-text-secondary,#6b7280)]/20", className),
+		className: cn$11("overflow-hidden rounded-lg bg-[var(--dashboard-surface,#ffffff)] shadow-sm", bordered && "border border-[var(--dashboard-text-secondary,#6b7280)]/20", className),
 		children: [/* @__PURE__ */ jsx("div", {
 			className: "overflow-x-auto",
 			children: /* @__PURE__ */ jsxs("table", {
 				className: "min-w-full divide-y divide-[var(--dashboard-text-secondary,#6b7280)]/20",
 				children: [/* @__PURE__ */ jsx("thead", {
-					className: cn$9("bg-[var(--dashboard-text-secondary,#6b7280)]/5", stickyHeader && "sticky top-0 z-10"),
+					className: cn$11("bg-[var(--dashboard-text-secondary,#6b7280)]/5", stickyHeader && "sticky top-0 z-10"),
 					children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx("tr", { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx("th", {
 						scope: "col",
-						className: cn$9("text-left text-xs font-semibold text-[var(--dashboard-text-secondary,#6b7280)] uppercase tracking-wider", headerPadding, header.column.getCanSort() && "cursor-pointer select-none"),
+						className: cn$11("text-left text-xs font-semibold text-[var(--dashboard-text-secondary,#6b7280)] uppercase tracking-wider", headerPadding, header.column.getCanSort() && "cursor-pointer select-none"),
 						style: header.getSize() !== 150 ? { width: header.getSize() } : void 0,
 						onClick: header.column.getToggleSortingHandler(),
 						children: /* @__PURE__ */ jsxs("div", {
@@ -3152,9 +3143,9 @@ function DataGrid({ columns, data, isLoading = false, skeletonRows = 5, sorting:
 						})
 					}) }) : table.getRowModel().rows.map((row, rowIndex) => /* @__PURE__ */ jsx("tr", {
 						onClick: () => onRowClick?.(row.original),
-						className: cn$9("transition-colors", onRowClick && "cursor-pointer", "hover:bg-[var(--dashboard-text-secondary,#6b7280)]/5", row.getIsSelected() && "bg-[var(--dashboard-primary,#37a501)]/5", striped && rowIndex % 2 === 1 && "bg-[var(--dashboard-text-secondary,#6b7280)]/3"),
+						className: cn$11("transition-colors", onRowClick && "cursor-pointer", "hover:bg-[var(--dashboard-text-secondary,#6b7280)]/5", row.getIsSelected() && "bg-[var(--dashboard-primary,#37a501)]/5", striped && rowIndex % 2 === 1 && "bg-[var(--dashboard-text-secondary,#6b7280)]/3"),
 						children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx("td", {
-							className: cn$9(cellPadding, "text-sm text-[var(--dashboard-text-primary,#2d2d2d)]"),
+							className: cn$11(cellPadding, "text-sm text-[var(--dashboard-text-primary,#2d2d2d)]"),
 							children: flexRender(cell.column.columnDef.cell, cell.getContext())
 						}, cell.id))
 					}, row.id))
@@ -3215,7 +3206,7 @@ function DataGrid({ columns, data, isLoading = false, skeletonRows = 5, sorting:
 //#endregion
 //#region src/components/TreeView/index.tsx
-const cn$8 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$10 = (...classes) => classes.filter(Boolean).join(" ");
 function TreeItem({ node, level, expanded, selectedId, draggable, indentSize, onSelect, onToggle, onMove, renderNode, dragState, setDragState }) {
 	const hasChildren = node.children && node.children.length > 0;
 	const isExpanded = expanded.has(node.id);
@@ -3280,7 +3271,7 @@ function TreeItem({ node, level, expanded, selectedId, draggable, indentSize, on
 		"aria-expanded": hasChildren ? isExpanded : void 0,
 		"aria-selected": isSelected,
 		children: [/* @__PURE__ */ jsxs("div", {
-			className: cn$8("group flex items-center gap-1 rounded-md px-2 py-1.5 transition-colors", isSelected ? "bg-[var(--dashboard-primary,#37a501)]/10 text-[var(--dashboard-primary,#37a501)]" : "hover:bg-[var(--dashboard-text-secondary,#6b7280)]/10 text-[var(--dashboard-text-primary,#2d2d2d)]", isDragging && "opacity-40", isDropTarget && dragState.position === "inside" && "ring-2 ring-[var(--dashboard-primary,#37a501)] ring-inset", node.disabled && "opacity-50 cursor-not-allowed"),
+			className: cn$10("group flex items-center gap-1 rounded-md px-2 py-1.5 transition-colors", isSelected ? "bg-[var(--dashboard-primary,#37a501)]/10 text-[var(--dashboard-primary,#37a501)]" : "hover:bg-[var(--dashboard-text-secondary,#6b7280)]/10 text-[var(--dashboard-text-primary,#2d2d2d)]", isDragging && "opacity-40", isDropTarget && dragState.position === "inside" && "ring-2 ring-[var(--dashboard-primary,#37a501)] ring-inset", node.disabled && "opacity-50 cursor-not-allowed"),
 			style: { paddingLeft: `${level * indentSize + 4}px` },
 			draggable: draggable && !node.disabled,
 			onDragStart: handleDragStart,
@@ -3298,10 +3289,10 @@ function TreeItem({ node, level, expanded, selectedId, draggable, indentSize, on
 				/* @__PURE__ */ jsx("button", {
 					type: "button",
 					onClick: () => hasChildren && onToggle(node.id),
-					className: cn$8("flex-shrink-0 w-5 h-5 flex items-center justify-center rounded transition-transform", hasChildren ? "cursor-pointer" : "invisible"),
+					className: cn$10("flex-shrink-0 w-5 h-5 flex items-center justify-center rounded transition-transform", hasChildren ? "cursor-pointer" : "invisible"),
 					tabIndex: hasChildren ? 0 : -1,
 					"aria-label": isExpanded ? "Recolher" : "Expandir",
-					children: /* @__PURE__ */ jsx(ChevronRight, { className: cn$8("h-3.5 w-3.5 transition-transform duration-150", isExpanded && "rotate-90") })
+					children: /* @__PURE__ */ jsx(ChevronRight, { className: cn$10("h-3.5 w-3.5 transition-transform duration-150", isExpanded && "rotate-90") })
 				}),
 				renderNode ? /* @__PURE__ */ jsx("div", {
 					className: "flex-1 min-w-0 cursor-pointer",
@@ -3313,7 +3304,7 @@ function TreeItem({ node, level, expanded, selectedId, draggable, indentSize, on
 						children: node.icon
 					}),
 					/* @__PURE__ */ jsx("span", {
-						className: cn$8("flex-1 min-w-0 text-sm truncate", !node.disabled && "cursor-pointer"),
+						className: cn$10("flex-1 min-w-0 text-sm truncate", !node.disabled && "cursor-pointer"),
 						onClick: () => !node.disabled && onSelect?.(node),
 						children: node.label
 					}),
@@ -3366,7 +3357,7 @@ function TreeView({ nodes, onSelect, onExpand, onMove, renderNode, selectedId, d
 	}, [onExpand]);
 	return /* @__PURE__ */ jsx("ul", {
 		role: "tree",
-		className: cn$8("select-none", className),
+		className: cn$10("select-none", className),
 		children: nodes.map((node) => /* @__PURE__ */ jsx(TreeItem, {
 			node,
 			level: 0,
@@ -3386,7 +3377,7 @@ function TreeView({ nodes, onSelect, onExpand, onMove, renderNode, selectedId, d
 //#endregion
 //#region src/components/Stepper/index.tsx
-const cn$7 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$9 = (...classes) => classes.filter(Boolean).join(" ");
 function StepIcon({ step, index }) {
 	const status = step.status || "pending";
 	if (status === "completed") return /* @__PURE__ */ jsx("div", {
@@ -3430,17 +3421,17 @@ function Stepper({ steps, activeStep, onStepChange, orientation = "horizontal",
 						type: "button",
 						onClick: () => onStepChange?.(index),
 						disabled: !onStepChange,
-						className: cn$7("relative z-10", onStepChange && "cursor-pointer", !onStepChange && "cursor-default"),
+						className: cn$9("relative z-10", onStepChange && "cursor-pointer", !onStepChange && "cursor-default"),
 						"aria-current": step.status === "active" ? "step" : void 0,
 						children: /* @__PURE__ */ jsx(StepIcon, {
 							step,
 							index
 						})
-					}), index < resolvedSteps.length - 1 && /* @__PURE__ */ jsx("div", { className: cn$7("w-0.5 flex-1 min-h-[32px]", step.status === "completed" ? "bg-[var(--dashboard-primary,#37a501)]" : "bg-[var(--dashboard-text-secondary,#6b7280)]/20") })]
+					}), index < resolvedSteps.length - 1 && /* @__PURE__ */ jsx("div", { className: cn$9("w-0.5 flex-1 min-h-[32px]", step.status === "completed" ? "bg-[var(--dashboard-primary,#37a501)]" : "bg-[var(--dashboard-text-secondary,#6b7280)]/20") })]
 				}), /* @__PURE__ */ jsxs("div", {
-					className: cn$7("pb-6", index === resolvedSteps.length - 1 && "pb-0"),
+					className: cn$9("pb-6", index === resolvedSteps.length - 1 && "pb-0"),
 					children: [/* @__PURE__ */ jsx("p", {
-						className: cn$7("text-sm font-medium leading-8", step.status === "active" ? "text-[var(--dashboard-primary,#37a501)]" : step.status === "completed" ? "text-[var(--dashboard-text-primary,#2d2d2d)]" : step.status === "error" ? "text-[var(--dashboard-status-danger,#EF4444)]" : "text-[var(--dashboard-text-secondary,#6b7280)]"),
+						className: cn$9("text-sm font-medium leading-8", step.status === "active" ? "text-[var(--dashboard-primary,#37a501)]" : step.status === "completed" ? "text-[var(--dashboard-text-primary,#2d2d2d)]" : step.status === "error" ? "text-[var(--dashboard-status-danger,#EF4444)]" : "text-[var(--dashboard-text-secondary,#6b7280)]"),
 						children: step.label
 					}), step.description && /* @__PURE__ */ jsx("p", {
 						className: "text-xs text-[var(--dashboard-text-secondary,#6b7280)] mt-0.5",
@@ -3456,12 +3447,12 @@ function Stepper({ steps, activeStep, onStepChange, orientation = "horizontal",
 		children: /* @__PURE__ */ jsx("ol", {
 			className: "flex items-center",
 			children: resolvedSteps.map((step, index) => /* @__PURE__ */ jsxs("li", {
-				className: cn$7("flex items-center", index < resolvedSteps.length - 1 && "flex-1"),
+				className: cn$9("flex items-center", index < resolvedSteps.length - 1 && "flex-1"),
 				children: [/* @__PURE__ */ jsxs("button", {
 					type: "button",
 					onClick: () => onStepChange?.(index),
 					disabled: !onStepChange,
-					className: cn$7("flex items-center gap-2 group", onStepChange && "cursor-pointer", !onStepChange && "cursor-default"),
+					className: cn$9("flex items-center gap-2 group", onStepChange && "cursor-pointer", !onStepChange && "cursor-default"),
 					"aria-current": step.status === "active" ? "step" : void 0,
 					children: [/* @__PURE__ */ jsx(StepIcon, {
 						step,
@@ -3469,14 +3460,14 @@ function Stepper({ steps, activeStep, onStepChange, orientation = "horizontal",
 					}), /* @__PURE__ */ jsxs("div", {
 						className: "hidden sm:block text-left",
 						children: [/* @__PURE__ */ jsx("p", {
-							className: cn$7("text-sm font-medium whitespace-nowrap", step.status === "active" ? "text-[var(--dashboard-primary,#37a501)]" : step.status === "completed" ? "text-[var(--dashboard-text-primary,#2d2d2d)]" : step.status === "error" ? "text-[var(--dashboard-status-danger,#EF4444)]" : "text-[var(--dashboard-text-secondary,#6b7280)]"),
+							className: cn$9("text-sm font-medium whitespace-nowrap", step.status === "active" ? "text-[var(--dashboard-primary,#37a501)]" : step.status === "completed" ? "text-[var(--dashboard-text-primary,#2d2d2d)]" : step.status === "error" ? "text-[var(--dashboard-status-danger,#EF4444)]" : "text-[var(--dashboard-text-secondary,#6b7280)]"),
 							children: step.label
 						}), step.description && /* @__PURE__ */ jsx("p", {
 							className: "text-xs text-[var(--dashboard-text-secondary,#6b7280)] whitespace-nowrap",
 							children: step.description
 						})]
 					})]
-				}), index < resolvedSteps.length - 1 && /* @__PURE__ */ jsx("div", { className: cn$7("flex-1 h-0.5 mx-3", step.status === "completed" ? "bg-[var(--dashboard-primary,#37a501)]" : "bg-[var(--dashboard-text-secondary,#6b7280)]/20") })]
+				}), index < resolvedSteps.length - 1 && /* @__PURE__ */ jsx("div", { className: cn$9("flex-1 h-0.5 mx-3", step.status === "completed" ? "bg-[var(--dashboard-primary,#37a501)]" : "bg-[var(--dashboard-text-secondary,#6b7280)]/20") })]
 			}, step.id))
 		})
 	});
@@ -3484,7 +3475,7 @@ function Stepper({ steps, activeStep, onStepChange, orientation = "horizontal",
 //#endregion
 //#region src/components/FileUpload/index.tsx
-const cn$6 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$8 = (...classes) => classes.filter(Boolean).join(" ");
 function formatSize(bytes) {
 	if (bytes < 1024) return `${bytes} B`;
 	if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
@@ -3580,7 +3571,7 @@ function FileUpload({ accept, maxSize, multiple = false, onUpload, onRemove, pre
 				onDragOver: handleDragOver,
 				onDragLeave: handleDragLeave,
 				onClick: () => !disabled && inputRef.current?.click(),
-				className: cn$6("relative flex flex-col items-center justify-center rounded-lg border-2 border-dashed p-6 transition-colors", isDragging ? "border-[var(--dashboard-primary,#37a501)] bg-[var(--dashboard-primary,#37a501)]/5" : "border-[var(--dashboard-text-secondary,#6b7280)]/30 hover:border-[var(--dashboard-text-secondary,#6b7280)]/50", disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"),
+				className: cn$8("relative flex flex-col items-center justify-center rounded-lg border-2 border-dashed p-6 transition-colors", isDragging ? "border-[var(--dashboard-primary,#37a501)] bg-[var(--dashboard-primary,#37a501)]/5" : "border-[var(--dashboard-text-secondary,#6b7280)]/30 hover:border-[var(--dashboard-text-secondary,#6b7280)]/50", disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer"),
 				role: "button",
 				tabIndex: disabled ? -1 : 0,
 				"aria-label": label,
@@ -3603,7 +3594,7 @@ function FileUpload({ accept, maxSize, multiple = false, onUpload, onRemove, pre
 				}), /* @__PURE__ */ jsxs("div", {
 					className: "flex flex-col items-center text-center",
 					children: [
-						icon || /* @__PURE__ */ jsx(Upload, { className: cn$6("h-8 w-8 mb-3", isDragging ? "text-[var(--dashboard-primary,#37a501)]" : "text-[var(--dashboard-text-secondary,#6b7280)]") }),
+						icon || /* @__PURE__ */ jsx(Upload, { className: cn$8("h-8 w-8 mb-3", isDragging ? "text-[var(--dashboard-primary,#37a501)]" : "text-[var(--dashboard-text-secondary,#6b7280)]") }),
 						/* @__PURE__ */ jsx("p", {
 							className: "text-sm font-medium text-[var(--dashboard-text-primary,#2d2d2d)]",
 							children: label
@@ -3670,7 +3661,7 @@ function FileUpload({ accept, maxSize, multiple = false, onUpload, onRemove, pre
 //#endregion
 //#region src/components/Tooltip/index.tsx
-const cn$5 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$7 = (...classes) => classes.filter(Boolean).join(" ");
 function Tooltip({ content, position = "top", delay = 200, children, className, maxWidth = 240 }) {
 	const [visible, setVisible] = useState(false);
 	const [coords, setCoords] = useState({
@@ -3743,7 +3734,7 @@ function Tooltip({ content, position = "top", delay = 200, children, className,
 		ref: tooltipRef,
 		id: idRef.current,
 		role: "tooltip",
-		className: cn$5("fixed z-[10002] rounded-md px-3 py-2 text-xs font-medium", "bg-[var(--dashboard-text-primary,#2d2d2d)] text-white", "shadow-lg dashboard-animate-fade-in pointer-events-none", className),
+		className: cn$7("fixed z-[10002] rounded-md px-3 py-2 text-xs font-medium", "bg-[var(--dashboard-text-primary,#2d2d2d)] text-white", "shadow-lg dashboard-animate-fade-in pointer-events-none", className),
 		style: {
 			top: coords.top,
 			left: coords.left,
@@ -3755,7 +3746,7 @@ function Tooltip({ content, position = "top", delay = 200, children, className,
 //#endregion
 //#region src/components/Breadcrumb/index.tsx
-const cn$4 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$6 = (...classes) => classes.filter(Boolean).join(" ");
 function Breadcrumb({ items, separator, onNavigate, className }) {
 	const defaultSeparator = /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4 text-[var(--dashboard-text-secondary,#6b7280)] flex-shrink-0" });
 	const handleClick = (e, href) => {
@@ -3777,7 +3768,7 @@ function Breadcrumb({ items, separator, onNavigate, className }) {
 						"aria-hidden": "true",
 						children: separator || defaultSeparator
 					}), isLast ? /* @__PURE__ */ jsxs("span", {
-						className: cn$4("flex items-center gap-1.5 text-sm font-medium", "text-[var(--dashboard-text-primary,#2d2d2d)]"),
+						className: cn$6("flex items-center gap-1.5 text-sm font-medium", "text-[var(--dashboard-text-primary,#2d2d2d)]"),
 						"aria-current": "page",
 						children: [item.icon && /* @__PURE__ */ jsx("span", {
 							className: "flex-shrink-0 h-4 w-4",
@@ -3786,7 +3777,7 @@ function Breadcrumb({ items, separator, onNavigate, className }) {
 					}) : /* @__PURE__ */ jsxs("a", {
 						href: item.href || "#",
 						onClick: (e) => handleClick(e, item.href),
-						className: cn$4("flex items-center gap-1.5 text-sm", "text-[var(--dashboard-text-secondary,#6b7280)]", "hover:text-[var(--dashboard-primary,#37a501)] transition-colors"),
+						className: cn$6("flex items-center gap-1.5 text-sm", "text-[var(--dashboard-text-secondary,#6b7280)]", "hover:text-[var(--dashboard-primary,#37a501)] transition-colors"),
 						children: [item.icon && /* @__PURE__ */ jsx("span", {
 							className: "flex-shrink-0 h-4 w-4",
 							children: item.icon
@@ -3800,7 +3791,7 @@ function Breadcrumb({ items, separator, onNavigate, className }) {
 //#endregion
 //#region src/components/Combobox/index.tsx
-const cn$3 = (...classes) => classes.filter(Boolean).join(" ");
+const cn$5 = (...classes) => classes.filter(Boolean).join(" ");
 function Combobox({ options, value, onChange, multiple = false, searchable = true, placeholder = "Selecione...", label, error, disabled = false, renderOption, noResultsText = "Nenhum resultado encontrado", className }) {
 	const [isOpen, setIsOpen] = useState(false);
 	const [query, setQuery] = useState("");
@@ -3930,7 +3921,7 @@ function Combobox({ options, value, onChange, multiple = false, searchable = tru
 	}, [focusedIndex]);
 	const selectedLabels = selectedValues.map((v) => options.find((o) => o.value === v)?.label).filter(Boolean);
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn$3("space-y-2", className),
+		className: cn$5("space-y-2", className),
 		children: [
 			label && /* @__PURE__ */ jsx("label", {
 				className: "block text-sm text-[var(--dashboard-text-primary,#2d2d2d)]",
@@ -3946,7 +3937,7 @@ function Combobox({ options, value, onChange, multiple = false, searchable = tru
 					"aria-controls": "combobox-listbox",
 					tabIndex: disabled ? -1 : 0,
 					onClick: () => isOpen ? close() : open(),
-					className: cn$3("flex min-h-[40px] w-full items-center gap-2 rounded-lg border px-3 py-2 transition-colors", isOpen ? "border-[var(--dashboard-primary,#37a501)] ring-2 ring-[var(--dashboard-primary,#37a501)]/20" : error ? "border-[var(--dashboard-status-danger,#EF4444)]" : "border-[var(--dashboard-text-secondary,#6b7280)]/30 hover:border-[var(--dashboard-text-secondary,#6b7280)]/50", disabled ? "opacity-50 cursor-not-allowed bg-[var(--dashboard-text-secondary,#6b7280)]/10" : "cursor-pointer bg-[var(--dashboard-surface,#ffffff)]"),
+					className: cn$5("flex min-h-[40px] w-full items-center gap-2 rounded-lg border px-3 py-2 transition-colors", isOpen ? "border-[var(--dashboard-primary,#37a501)] ring-2 ring-[var(--dashboard-primary,#37a501)]/20" : error ? "border-[var(--dashboard-status-danger,#EF4444)]" : "border-[var(--dashboard-text-secondary,#6b7280)]/30 hover:border-[var(--dashboard-text-secondary,#6b7280)]/50", disabled ? "opacity-50 cursor-not-allowed bg-[var(--dashboard-text-secondary,#6b7280)]/10" : "cursor-pointer bg-[var(--dashboard-surface,#ffffff)]"),
 					children: [
 						/* @__PURE__ */ jsx("div", {
 							className: "flex flex-1 flex-wrap items-center gap-1 min-w-0",
@@ -3974,7 +3965,7 @@ function Combobox({ options, value, onChange, multiple = false, searchable = tru
 							"aria-label": "Limpar seleção",
 							children: /* @__PURE__ */ jsx(X, { className: "h-3.5 w-3.5" })
 						}),
-						/* @__PURE__ */ jsx(ChevronDown, { className: cn$3("h-4 w-4 flex-shrink-0 text-[var(--dashboard-text-secondary,#6b7280)] transition-transform", isOpen && "rotate-180") })
+						/* @__PURE__ */ jsx(ChevronDown, { className: cn$5("h-4 w-4 flex-shrink-0 text-[var(--dashboard-text-secondary,#6b7280)] transition-transform", isOpen && "rotate-180") })
 					]
 				}), isOpen && typeof document !== "undefined" && createPortal(/* @__PURE__ */ jsxs("div", {
 					className: "dc-combobox-portal rounded-lg border border-[var(--dashboard-text-secondary,#6b7280)]/20 bg-[var(--dashboard-surface,#ffffff)] shadow-lg dashboard-animate-fade-in overflow-hidden",
@@ -4019,7 +4010,7 @@ function Combobox({ options, value, onChange, multiple = false, searchable = tru
 								onClick: () => {
 									if (!option.disabled) toggleOption(option.value);
 								},
-								className: cn$3("flex items-center justify-between px-3 py-2 text-sm transition-colors", option.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer", isFocused && "bg-[var(--dashboard-text-secondary,#6b7280)]/10", !isFocused && !option.disabled && "hover:bg-[var(--dashboard-text-secondary,#6b7280)]/10", isSelected ? "text-[var(--dashboard-primary,#37a501)] font-medium" : "text-[var(--dashboard-text-primary,#2d2d2d)]"),
+								className: cn$5("flex items-center justify-between px-3 py-2 text-sm transition-colors", option.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer", isFocused && "bg-[var(--dashboard-text-secondary,#6b7280)]/10", !isFocused && !option.disabled && "hover:bg-[var(--dashboard-text-secondary,#6b7280)]/10", isSelected ? "text-[var(--dashboard-primary,#37a501)] font-medium" : "text-[var(--dashboard-text-primary,#2d2d2d)]"),
 								children: renderOption ? renderOption(option, isSelected) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
 									className: "truncate",
 									children: option.label
@@ -4039,8 +4030,8 @@ function Combobox({ options, value, onChange, multiple = false, searchable = tru
 //#endregion
 //#region src/components/Alert/index.tsx
-const cn$2 = (...classes) => classes.filter(Boolean).join(" ");
-const variantConfig = {
+const cn$4 = (...classes) => classes.filter(Boolean).join(" ");
+const variantConfig$1 = {
 	info: {
 		border: "border-[var(--dashboard-status-info,#3b82f6)]",
 		bg: "bg-[var(--dashboard-status-info,#3b82f6)]/5",
@@ -4067,26 +4058,26 @@ const variantConfig = {
 	}
 };
 function Alert({ variant = "info", title, description, onClose, actions, icon, className }) {
-	const config = variantConfig[variant];
+	const config = variantConfig$1[variant];
 	return /* @__PURE__ */ jsx("div", {
-		className: cn$2("rounded-lg border-l-4 p-4", config.border, config.bg, className),
+		className: cn$4("rounded-lg border-l-4 p-4", config.border, config.bg, className),
 		role: "alert",
 		children: /* @__PURE__ */ jsxs("div", {
 			className: "flex gap-3",
 			children: [
 				/* @__PURE__ */ jsx("div", {
-					className: cn$2("flex-shrink-0 mt-0.5", config.text),
+					className: cn$4("flex-shrink-0 mt-0.5", config.text),
 					children: icon || config.icon
 				}),
 				/* @__PURE__ */ jsxs("div", {
 					className: "flex-1 min-w-0",
 					children: [
 						title && /* @__PURE__ */ jsx("h3", {
-							className: cn$2("text-sm font-semibold", "text-[var(--dashboard-text-primary,#2d2d2d)]"),
+							className: cn$4("text-sm font-semibold", "text-[var(--dashboard-text-primary,#2d2d2d)]"),
 							children: title
 						}),
 						description && /* @__PURE__ */ jsx("div", {
-							className: cn$2("text-sm text-[var(--dashboard-text-secondary,#6b7280)]", title && "mt-1"),
+							className: cn$4("text-sm text-[var(--dashboard-text-secondary,#6b7280)]", title && "mt-1"),
 							children: description
 						}),
 						actions && /* @__PURE__ */ jsx("div", {
@@ -4106,6 +4097,116 @@ function Alert({ variant = "info", title, description, onClose, actions, icon, c
 	});
 }
+//#endregion
+//#region src/components/Callout/index.tsx
+const cn$3 = (...classes) => classes.filter(Boolean).join(" ");
+const variantConfig = {
+	info: {
+		border: "border-[var(--dashboard-status-info,#3b82f6)]",
+		bg: "bg-[var(--dashboard-status-info,#3b82f6)]/5",
+		text: "text-[var(--dashboard-status-info,#3b82f6)]",
+		icon: /* @__PURE__ */ jsx(Info, { className: "h-4 w-4" })
+	},
+	warning: {
+		border: "border-[var(--dashboard-status-warning,#f59e0b)]",
+		bg: "bg-[var(--dashboard-status-warning,#f59e0b)]/5",
+		text: "text-[var(--dashboard-status-warning,#f59e0b)]",
+		icon: /* @__PURE__ */ jsx(AlertTriangle, { className: "h-4 w-4" })
+	},
+	tip: {
+		border: "border-[var(--dashboard-status-success,#10B981)]",
+		bg: "bg-[var(--dashboard-status-success,#10B981)]/5",
+		text: "text-[var(--dashboard-status-success,#10B981)]",
+		icon: /* @__PURE__ */ jsx(Lightbulb, { className: "h-4 w-4" })
+	},
+	danger: {
+		border: "border-[var(--dashboard-status-danger,#EF4444)]",
+		bg: "bg-[var(--dashboard-status-danger,#EF4444)]/5",
+		text: "text-[var(--dashboard-status-danger,#EF4444)]",
+		icon: /* @__PURE__ */ jsx(ShieldAlert, { className: "h-4 w-4" })
+	}
+};
+function Callout({ variant = "info", title, children, icon, className }) {
+	const config = variantConfig[variant];
+	return /* @__PURE__ */ jsx("div", {
+		className: cn$3("rounded-lg border-l-4 p-4 my-4", config.border, config.bg, className),
+		role: "note",
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "flex gap-3",
+			children: [/* @__PURE__ */ jsx("div", {
+				className: cn$3("flex-shrink-0 mt-0.5", config.text),
+				children: icon || config.icon
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "flex-1 min-w-0",
+				children: [title && /* @__PURE__ */ jsx("p", {
+					className: cn$3("text-sm font-semibold", "text-[var(--dashboard-text-primary,#2d2d2d)]"),
+					children: title
+				}), children && /* @__PURE__ */ jsx("div", {
+					className: cn$3("text-sm text-[var(--dashboard-text-secondary,#6b7280)]", title && "mt-1"),
+					children
+				})]
+			})]
+		})
+	});
+}
+//#endregion
+//#region src/components/CodeBlock/index.tsx
+const cn$2 = (...classes) => classes.filter(Boolean).join(" ");
+function CodeBlock({ code, language, filename, showLineNumbers = false, className, copyLabel = "Copiar", copiedLabel = "Copiado!" }) {
+	const [copied, setCopied] = useState(false);
+	const handleCopy = useCallback(async () => {
+		try {
+			await navigator.clipboard.writeText(code);
+			setCopied(true);
+			setTimeout(() => setCopied(false), 2e3);
+		} catch {}
+	}, [code]);
+	const lines = code.split("\n");
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn$2("relative rounded-lg overflow-hidden border border-[var(--dashboard-text-secondary,#64748B)]/12 my-4", className),
+		children: [(filename || language) && /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center justify-between px-4 py-2 bg-[var(--dashboard-text-primary,#0F172A)] border-b border-[var(--dashboard-text-secondary,#64748B)]/20",
+			children: [
+				filename && /* @__PURE__ */ jsx("span", {
+					className: "text-xs text-[var(--dashboard-text-secondary,#64748B)] font-mono",
+					children: filename
+				}),
+				language && !filename && /* @__PURE__ */ jsx("span", {}),
+				language && /* @__PURE__ */ jsx("span", {
+					className: "text-xs text-[var(--dashboard-text-secondary,#64748B)]/60",
+					children: language
+				})
+			]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "relative",
+			children: [/* @__PURE__ */ jsx("pre", {
+				className: "overflow-x-auto p-4 bg-[var(--dashboard-text-primary,#0F172A)] m-0",
+				"data-language": language,
+				children: /* @__PURE__ */ jsx("code", {
+					className: "text-sm font-mono leading-relaxed text-[var(--dashboard-surface,#FFFFFF)]/90",
+					children: showLineNumbers ? lines.map((line, i) => /* @__PURE__ */ jsxs("span", {
+						className: "table-row",
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "table-cell pr-4 text-right select-none text-[var(--dashboard-text-secondary,#64748B)]/40 text-xs w-8",
+							children: i + 1
+						}), /* @__PURE__ */ jsxs("span", {
+							className: "table-cell",
+							children: [line, "\n"]
+						})]
+					}, i)) : code
+				})
+			}), /* @__PURE__ */ jsxs("button", {
+				onClick: handleCopy,
+				className: cn$2("absolute top-3 right-3 flex items-center gap-1.5 px-2 py-1 rounded-md text-xs font-medium transition-all duration-200 cursor-pointer", copied ? "bg-[var(--dashboard-status-success,#059669)]/20 text-[var(--dashboard-status-success,#059669)]" : "bg-[var(--dashboard-surface,#FFFFFF)]/10 text-[var(--dashboard-surface,#FFFFFF)]/60 hover:bg-[var(--dashboard-surface,#FFFFFF)]/20 hover:text-[var(--dashboard-surface,#FFFFFF)]/80"),
+				"aria-label": copied ? copiedLabel : copyLabel,
+				title: copied ? copiedLabel : copyLabel,
+				children: [copied ? /* @__PURE__ */ jsx(Check, { className: "h-3.5 w-3.5" }) : /* @__PURE__ */ jsx(Copy, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ jsx("span", { children: copied ? copiedLabel : copyLabel })]
+			})]
+		})]
+	});
+}
 //#endregion
 //#region src/components/EmptyState/index.tsx
 const cn$1 = (...classes) => classes.filter(Boolean).join(" ");
@@ -4434,5 +4535,5 @@ function DashboardProvider({ config: configOverrides, children }) {
 }
 //#endregion
-export { Alert, AuthLayout, BadgeStatus, Breadcrumb, Button, Card, Checkbox, CodeInput, Combobox, ComparisonLineChart, DashboardProvider, DataGrid, DateRangePicker, DoughnutChart, Dropdown, EmptyState, FileUpload, FilterBar, FormField, HorizontalBarChart, Input, KPICard, Loading, LoadingProvider, MetricPanel, Modal, NotificationsProvider, PageLayout, Pagination, ProgressBarList, Sidebar, Skeleton, StatusBadge, Stepper, Table, TableBody, TableEmpty, TableHeader, TableSkeleton, Tabs, ThemeProvider, ThemeSwitcher, Title, Toast, ToggleSwitch, Tooltip, TreeView, VerticalBarChart, createColumnHelper, createConfig, defaultConfig, useConfig, useLoading, useNotifications, useTheme };
+export { Alert, AuthLayout, BadgeStatus, Breadcrumb, Button, Callout, Card, Checkbox, CodeBlock, CodeInput, Combobox, ComparisonLineChart, DashboardProvider, DataGrid, DateRangePicker, DoughnutChart, Dropdown, EmptyState, FileUpload, FilterBar, FormField, HorizontalBarChart, Input, KPICard, Loading, LoadingProvider, MetricPanel, Modal, NotificationsProvider, PageLayout, Pagination, ProgressBarList, Sidebar, Skeleton, StatusBadge, Stepper, Table, TableBody, TableEmpty, TableHeader, TableSkeleton, Tabs, ThemeProvider, ThemeSwitcher, Title, Toast, ToggleSwitch, Tooltip, TreeView, VerticalBarChart, createColumnHelper, createConfig, defaultConfig, useConfig, useLoading, useNotifications, useTheme };
 //# sourceMappingURL=index.mjs.map