@axzydev/axzy_ui_system 1.2.2 → 1.2.4

package/dist/index.d.cts

@@ -812,6 +812,8 @@ interface ITPageProps {
     backAction?: () => void;
     loading?: boolean;
     error?: string | null;
+    errorTitle?: string;
+    errorActionLabel?: string;
     onRetry?: () => void;
     empty?: boolean;
     emptyTitle?: string;
@@ -821,7 +823,7 @@ interface ITPageProps {
     children: ReactNode;
 }
 
-declare function ITPage({ title, description, breadcrumbs, actions, backAction, loading, error, onRetry, empty, emptyTitle, emptyDescription, emptyAction, className, children, }: ITPageProps): react_jsx_runtime.JSX.Element;
+declare function ITPage(props: ITPageProps): react_jsx_runtime.JSX.Element;
 
 interface ITPageHeaderProps {
     title: string;

package/dist/index.d.ts

@@ -812,6 +812,8 @@ interface ITPageProps {
     backAction?: () => void;
     loading?: boolean;
     error?: string | null;
+    errorTitle?: string;
+    errorActionLabel?: string;
     onRetry?: () => void;
     empty?: boolean;
     emptyTitle?: string;
@@ -821,7 +823,7 @@ interface ITPageProps {
     children: ReactNode;
 }
 
-declare function ITPage({ title, description, breadcrumbs, actions, backAction, loading, error, onRetry, empty, emptyTitle, emptyDescription, emptyAction, className, children, }: ITPageProps): react_jsx_runtime.JSX.Element;
+declare function ITPage(props: ITPageProps): react_jsx_runtime.JSX.Element;
 
 interface ITPageHeaderProps {
     title: string;

package/dist/index.js

@@ -280,7 +280,7 @@ function ITText({
     Tag,
     {
       className,
-      style: muted ? { color: "var(--color-text-muted)", ...style } : { color: "var(--color-text-default)", ...style },
+      style: muted ? { color: "var(--color-text-muted)", ...style } : style,
       ...rest,
       children
     }
@@ -6579,10 +6579,9 @@ function ITNavbar({
 }
 
 // src/components/page/page.tsx
-import clsx29 from "clsx";
+import clsx28 from "clsx";
 
 // src/components/page-header/page-header.tsx
-import clsx26 from "clsx";
 import { FaChevronLeft as FaChevronLeft3 } from "react-icons/fa";
 import { jsx as jsx33, jsxs as jsxs25 } from "react/jsx-runtime";
 function ITPageHeader({
@@ -6594,7 +6593,7 @@ function ITPageHeader({
   className
 }) {
   const showTopRow = breadcrumbs?.length || backAction;
-  return /* @__PURE__ */ jsxs25("div", { className: clsx26(className), children: [
+  return /* @__PURE__ */ jsxs25("div", { className, children: [
     showTopRow && /* @__PURE__ */ jsxs25("div", { className: "flex items-center justify-between gap-4 mb-1", children: [
       /* @__PURE__ */ jsxs25("div", { className: "flex items-center gap-2 min-w-0", children: [
         backAction && /* @__PURE__ */ jsx33(
@@ -6621,7 +6620,7 @@ function ITPageHeader({
 }
 
 // src/components/skeleton/skeleton.tsx
-import clsx27 from "clsx";
+import clsx26 from "clsx";
 import { Fragment as Fragment6, jsx as jsx34 } from "react/jsx-runtime";
 var variantClasses = {
   text: "rounded-md h-4 w-full",
@@ -6645,7 +6644,7 @@ function ITSkeleton({
   return /* @__PURE__ */ jsx34(Fragment6, { children: items.map((i) => /* @__PURE__ */ jsx34(
     "div",
     {
-      className: clsx27(
+      className: clsx26(
         "animate-pulse bg-slate-200 dark:bg-slate-700",
         variantClasses[variant],
         variant === "text" && count > 1 && i < count - 1 && "mb-2",
@@ -6661,7 +6660,7 @@ function ITSkeleton({
 }
 
 // src/components/stack/stack.tsx
-import clsx28 from "clsx";
+import clsx27 from "clsx";
 import { Children, cloneElement, isValidElement, Fragment as Fragment7 } from "react";
 import { jsx as jsx35, jsxs as jsxs26 } from "react/jsx-runtime";
 var directionMap2 = {
@@ -6711,7 +6710,7 @@ function ITStack({
   return /* @__PURE__ */ jsx35(
     Component,
     {
-      className: clsx28(
+      className: clsx27(
         "flex",
         directionMap2[direction],
         alignItems && alignMap2[alignItems],
@@ -6730,48 +6729,68 @@ function ITStack({
 
 // src/components/page/page.tsx
 import { jsx as jsx36, jsxs as jsxs27 } from "react/jsx-runtime";
-function ITPage({
-  title,
-  description,
-  breadcrumbs,
-  actions,
-  backAction,
-  loading = false,
-  error = null,
-  onRetry,
-  empty = false,
-  emptyTitle,
-  emptyDescription,
-  emptyAction,
-  className,
-  children
-}) {
+var hasHeader = (props) => !!(props.title || props.description || props.breadcrumbs || props.actions || props.backAction);
+var renderHeader = (props) => {
+  if (!hasHeader(props)) return null;
+  return /* @__PURE__ */ jsx36(
+    ITPageHeader,
+    {
+      title: props.title || "",
+      description: props.description,
+      breadcrumbs: props.breadcrumbs,
+      actions: props.actions,
+      backAction: props.backAction
+    }
+  );
+};
+function ITPage(props) {
+  const {
+    loading = false,
+    error = null,
+    errorTitle,
+    errorActionLabel,
+    onRetry,
+    empty = false,
+    emptyTitle,
+    emptyDescription,
+    emptyAction,
+    className,
+    children
+  } = props;
+  const wrapperClass = clsx28("space-y-6", className);
   if (loading) {
-    return /* @__PURE__ */ jsxs27("div", { className, children: [
-      title && /* @__PURE__ */ jsx36(ITPageHeader, { title }),
-      /* @__PURE__ */ jsx36("div", { className: "mt-6", children: /* @__PURE__ */ jsxs27(ITStack, { spacing: 4, children: [
+    return /* @__PURE__ */ jsxs27("div", { className: wrapperClass, children: [
+      renderHeader(props),
+      /* @__PURE__ */ jsxs27(ITStack, { spacing: 4, children: [
         /* @__PURE__ */ jsx36(ITSkeleton, { variant: "rectangular", height: 40, width: "40%" }),
         /* @__PURE__ */ jsx36(ITSkeleton, { variant: "rectangular", height: 200 }),
         /* @__PURE__ */ jsx36(ITSkeleton, { variant: "rectangular", height: 200 })
-      ] }) })
+      ] })
     ] });
   }
   if (error) {
-    return /* @__PURE__ */ jsxs27("div", { className, children: [
-      title && /* @__PURE__ */ jsx36(ITPageHeader, { title }),
+    return /* @__PURE__ */ jsxs27("div", { className: wrapperClass, children: [
+      renderHeader(props),
       /* @__PURE__ */ jsx36(
         ITEmptyState,
         {
-          title: "Error",
+          title: errorTitle || "Error",
           description: error,
-          action: onRetry ? /* @__PURE__ */ jsx36(ITButton, { label: "Reintentar", onClick: onRetry, size: "small" }) : void 0
+          action: onRetry ? /* @__PURE__ */ jsx36(
+            ITButton,
+            {
+              label: errorActionLabel || "Reintentar",
+              onClick: onRetry,
+              size: "small"
+            }
+          ) : void 0
         }
       )
     ] });
   }
   if (empty) {
-    return /* @__PURE__ */ jsxs27("div", { className, children: [
-      title && /* @__PURE__ */ jsx36(ITPageHeader, { title }),
+    return /* @__PURE__ */ jsxs27("div", { className: wrapperClass, children: [
+      renderHeader(props),
       /* @__PURE__ */ jsx36(
         ITEmptyState,
         {
@@ -6782,24 +6801,15 @@ function ITPage({
       )
     ] });
   }
-  return /* @__PURE__ */ jsxs27("div", { className: clsx29("space-y-6", className), children: [
-    (title || breadcrumbs || actions || backAction) && /* @__PURE__ */ jsx36(
-      ITPageHeader,
-      {
-        title: title || "",
-        description,
-        breadcrumbs,
-        actions,
-        backAction
-      }
-    ),
+  return /* @__PURE__ */ jsxs27("div", { className: wrapperClass, children: [
+    renderHeader(props),
     children
   ] });
 }
 
 // src/components/popover/popover.tsx
 import { useState as useState18, useRef as useRef10 } from "react";
-import clsx30 from "clsx";
+import clsx29 from "clsx";
 import { jsx as jsx37, jsxs as jsxs28 } from "react/jsx-runtime";
 var positionClasses = {
   top: "bottom-full left-1/2 -translate-x-1/2 mb-2",
@@ -6823,14 +6833,14 @@ function ITPopover({
     if (isControlled) onClose?.();
     else setInternalOpen(false);
   });
-  return /* @__PURE__ */ jsxs28("div", { ref, className: clsx30("relative inline-flex", className), children: [
+  return /* @__PURE__ */ jsxs28("div", { ref, className: clsx29("relative inline-flex", className), children: [
     /* @__PURE__ */ jsx37("div", { onClick: () => isControlled ? onClose?.() : setInternalOpen((p) => !p), className: "cursor-pointer", children: trigger }),
-    open && /* @__PURE__ */ jsx37("div", { className: clsx30("absolute z-[200]", positionClasses[position]), children: /* @__PURE__ */ jsx37("div", { className: "bg-white dark:bg-slate-800 rounded-xl shadow-xl border border-slate-200 dark:border-slate-700 p-3 min-w-[160px]", children }) })
+    open && /* @__PURE__ */ jsx37("div", { className: clsx29("absolute z-[200]", positionClasses[position]), children: /* @__PURE__ */ jsx37("div", { className: "bg-white dark:bg-slate-800 rounded-xl shadow-xl border border-slate-200 dark:border-slate-700 p-3 min-w-[160px]", children }) })
   ] });
 }
 
 // src/components/progress/progress.tsx
-import clsx31 from "clsx";
+import clsx30 from "clsx";
 import { jsx as jsx38 } from "react/jsx-runtime";
 var colorMap = {
   primary: "bg-primary-500",
@@ -6861,7 +6871,7 @@ function ITProgress({
   return /* @__PURE__ */ jsx38(
     "div",
     {
-      className: clsx31("w-full bg-slate-200 dark:bg-slate-700 rounded-full overflow-hidden", sizeMap3[size], className),
+      className: clsx30("w-full bg-slate-200 dark:bg-slate-700 rounded-full overflow-hidden", sizeMap3[size], className),
       style,
       role: "progressbar",
       "aria-valuenow": variant === "determinate" ? value : void 0,
@@ -6869,7 +6879,7 @@ function ITProgress({
       children: /* @__PURE__ */ jsx38(
         "div",
         {
-          className: clsx31(
+          className: clsx30(
             "h-full rounded-full transition-all duration-500",
             colorMap[color],
             variant === "indeterminate" && "animate-pulse w-1/2"
@@ -6882,7 +6892,7 @@ function ITProgress({
 }
 
 // src/components/radio/radio.tsx
-import clsx32 from "clsx";
+import clsx31 from "clsx";
 import { jsx as jsx39, jsxs as jsxs29 } from "react/jsx-runtime";
 function ITRadioGroup({
   name,
@@ -6896,7 +6906,7 @@ function ITRadioGroup({
   return /* @__PURE__ */ jsx39(
     "div",
     {
-      className: clsx32(
+      className: clsx31(
         "flex gap-3",
         direction === "row" ? "flex-row flex-wrap" : "flex-col",
         className
@@ -6906,7 +6916,7 @@ function ITRadioGroup({
         return /* @__PURE__ */ jsxs29(
           "label",
           {
-            className: clsx32(
+            className: clsx31(
               "inline-flex items-center gap-2 cursor-pointer select-none",
               disabled && "opacity-50 cursor-not-allowed"
             ),
@@ -6926,7 +6936,7 @@ function ITRadioGroup({
               /* @__PURE__ */ jsx39(
                 "div",
                 {
-                  className: clsx32(
+                  className: clsx31(
                     "w-4 h-4 rounded-full border-2 flex items-center justify-center transition-all",
                     isSelected ? "border-primary-500" : "border-slate-300 dark:border-slate-600",
                     !disabled && "peer-focus:ring-2 peer-focus:ring-primary-200"
@@ -6946,7 +6956,7 @@ function ITRadioGroup({
 
 // src/components/search-select/search-select.tsx
 import { useState as useState19, useEffect as useEffect13, useRef as useRef11, useMemo as useMemo6 } from "react";
-import clsx33 from "clsx";
+import clsx32 from "clsx";
 import { FaSearch } from "react-icons/fa";
 import { jsx as jsx40, jsxs as jsxs30 } from "react/jsx-runtime";
 function ITSearchSelect({
@@ -7065,12 +7075,12 @@ function ITSearchSelect({
     }
     return style;
   };
-  return /* @__PURE__ */ jsxs30("div", { className: clsx33("w-full flex flex-col gap-1.5", className, isOpen && "relative z-30"), ref: containerRef, children: [
+  return /* @__PURE__ */ jsxs30("div", { className: clsx32("w-full flex flex-col gap-1.5", className, isOpen && "relative z-30"), ref: containerRef, children: [
     label && /* @__PURE__ */ jsxs30(
       ITText,
       {
         as: "label",
-        className: clsx33("text-sm font-medium text-gray-700 dark:text-slate-300", {
+        className: clsx32("text-sm font-medium text-gray-700 dark:text-slate-300", {
           "text-red-500": hasError
         }),
         children: [
@@ -7100,7 +7110,7 @@ function ITSearchSelect({
         ),
         /* @__PURE__ */ jsxs30("div", { className: "absolute right-3 flex items-center gap-2 text-gray-400 pointer-events-none", children: [
           isLoading && /* @__PURE__ */ jsx40("div", { className: "animate-spin h-4 w-4 border-2 border-primary-500 border-t-transparent rounded-full" }),
-          !isLoading && /* @__PURE__ */ jsx40(FaSearch, { size: 14, className: clsx33({ "text-primary-500": isFocused }) })
+          !isLoading && /* @__PURE__ */ jsx40(FaSearch, { size: 14, className: clsx32({ "text-primary-500": isFocused }) })
         ] })
       ] }),
       isOpen && /* @__PURE__ */ jsx40("div", { className: "absolute z-50 w-full mt-1 bg-white dark:bg-slate-900 border border-gray-200 dark:border-slate-800 rounded-lg shadow-xl overflow-hidden animate-in fade-in zoom-in duration-200 origin-top", children: /* @__PURE__ */ jsx40("div", { className: "max-h-60 overflow-y-auto", children: filteredOptions.length > 0 ? filteredOptions.map((option) => /* @__PURE__ */ jsx40(
@@ -7108,7 +7118,7 @@ function ITSearchSelect({
         {
           as: "div",
           onClick: () => handleSelect(option),
-          className: clsx33(
+          className: clsx32(
             "px-4 py-2 text-sm cursor-pointer transition-colors",
             value === option[valueField] ? "bg-primary-50 dark:bg-primary-950/40 text-primary-700 dark:text-primary-300 font-medium" : "hover:bg-gray-50 dark:hover:bg-slate-800 text-gray-700 dark:text-slate-300"
           ),
@@ -7122,7 +7132,7 @@ function ITSearchSelect({
 }
 
 // src/components/searchTable/searchTable.tsx
-import clsx35 from "clsx";
+import clsx34 from "clsx";
 import { useState as useState20 } from "react";
 
 // src/components/searchTable/components/SearchInput.tsx
@@ -7269,7 +7279,7 @@ var getNestedValue4 = (obj, path) => {
 };
 
 // src/components/searchTable/components/TableRow.tsx
-import clsx34 from "clsx";
+import clsx33 from "clsx";
 import { FaCheck as FaCheck3, FaTimes as FaTimes7 } from "react-icons/fa";
 
 // src/components/searchTable/components/EditableCell.tsx
@@ -7465,7 +7475,7 @@ function TableRow({
       children: columns.map((col) => /* @__PURE__ */ jsx47(
         "td",
         {
-          className: clsx34("pl-5 py-2", col.className, {
+          className: clsx33("pl-5 py-2", col.className, {
             "text-center": col.type === "actions" || col.type === "boolean"
           }),
           children: isEditing && col.editable ? /* @__PURE__ */ jsx47(
@@ -7480,7 +7490,7 @@ function TableRow({
           ) : /* @__PURE__ */ jsx47(
             "div",
             {
-              className: clsx34({
+              className: clsx33({
                 "flex flex-col items-center justify-center gap-1 ": col.type === "actions"
               }),
               children: renderCellContent(
@@ -7665,7 +7675,7 @@ function ITSearchTable({
     handleClearSearch();
     onClearSearch?.();
   };
-  return /* @__PURE__ */ jsxs38("div", { className: clsx35("space-y-4 w-full", containerClassName), children: [
+  return /* @__PURE__ */ jsxs38("div", { className: clsx34("space-y-4 w-full", containerClassName), children: [
     /* @__PURE__ */ jsxs38("div", { className: "shadow-md sm:rounded-lg overflow-hidden", children: [
       title && /* @__PURE__ */ jsx50("div", { className: "bg-teal-500 text-white px-6 py-4", children: /* @__PURE__ */ jsx50(ITText, { as: "h2", className: "text-xl font-bold text-center whitespace-nowrap", children: title }) }),
       /* @__PURE__ */ jsxs38("div", { className: "bg-white", children: [
@@ -7683,7 +7693,7 @@ function ITSearchTable({
         /* @__PURE__ */ jsx50("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs38(
           "table",
           {
-            className: clsx35(
+            className: clsx34(
               "min-w-full text-sm text-left bg-white text-gray-900 table-auto",
               variantStyles[variant],
               sizeStyles[size]
@@ -8031,7 +8041,7 @@ function ITSidebar({
 
 // src/components/slide/slide.tsx
 import { useState as useState22, useEffect as useEffect15 } from "react";
-import clsx36 from "clsx";
+import clsx35 from "clsx";
 import { jsx as jsx52 } from "react/jsx-runtime";
 function ITSlideToggle({
   onToggle,
@@ -8089,7 +8099,7 @@ function ITSlideToggle({
     "div",
     {
       onClick: toggleSwitch,
-      className: clsx36(
+      className: clsx35(
         "flex items-center rounded-full p-1 transition-colors duration-300",
         container,
         disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer",
@@ -8108,7 +8118,7 @@ function ITSlideToggle({
       children: /* @__PURE__ */ jsx52(
         "div",
         {
-          className: clsx36(
+          className: clsx35(
             "bg-white rounded-full shadow-md transform transition-transform duration-300 pointer-events-none",
             knob,
             isOn ? translate : "translate-x-0"
@@ -8120,7 +8130,7 @@ function ITSlideToggle({
 }
 
 // src/components/slider/slider.tsx
-import clsx37 from "clsx";
+import clsx36 from "clsx";
 import { jsx as jsx53, jsxs as jsxs40 } from "react/jsx-runtime";
 function ITSlider({
   value,
@@ -8132,7 +8142,7 @@ function ITSlider({
   disabled = false,
   className
 }) {
-  return /* @__PURE__ */ jsxs40("div", { className: clsx37("flex flex-col gap-1.5", className), children: [
+  return /* @__PURE__ */ jsxs40("div", { className: clsx36("flex flex-col gap-1.5", className), children: [
     label && /* @__PURE__ */ jsxs40(ITText, { as: "label", className: "text-xs font-semibold text-gray-600 dark:text-gray-400", children: [
       label,
       ": ",
@@ -8148,7 +8158,7 @@ function ITSlider({
         value,
         onChange: (e) => onChange(Number(e.target.value)),
         disabled,
-        className: clsx37(
+        className: clsx36(
           "w-full h-1.5 appearance-none rounded-full outline-none cursor-pointer",
           "bg-gray-200 dark:bg-gray-700",
           "accent-primary-500",
@@ -8168,7 +8178,7 @@ function ITSlider({
 }
 
 // src/components/stat-card/stat-card.tsx
-import clsx38 from "clsx";
+import clsx37 from "clsx";
 import { jsx as jsx54, jsxs as jsxs41 } from "react/jsx-runtime";
 var trendColors = {
   up: "text-emerald-600 bg-emerald-50 dark:text-emerald-400 dark:bg-emerald-950/30",
@@ -8189,7 +8199,7 @@ function ITStatCard({
   return /* @__PURE__ */ jsxs41(
     "div",
     {
-      className: clsx38("rounded-xl p-4 border border-slate-100 dark:border-slate-800", color, className),
+      className: clsx37("rounded-xl p-4 border border-slate-100 dark:border-slate-800", color, className),
       style,
       onClick,
       role: onClick ? "button" : void 0,
@@ -8201,7 +8211,7 @@ function ITStatCard({
         ] }),
         /* @__PURE__ */ jsxs41("div", { className: "flex items-baseline gap-2", children: [
           /* @__PURE__ */ jsx54(ITText, { as: "span", className: "text-2xl font-bold text-slate-800 dark:text-white", children: value }),
-          trend && /* @__PURE__ */ jsx54(ITText, { as: "span", className: clsx38("text-[11px] font-semibold px-1.5 py-0.5 rounded-md", trendColors[trendDirection]), children: trend })
+          trend && /* @__PURE__ */ jsx54(ITText, { as: "span", className: clsx37("text-[11px] font-semibold px-1.5 py-0.5 rounded-md", trendColors[trendDirection]), children: trend })
         ] })
       ]
     }
@@ -8209,7 +8219,7 @@ function ITStatCard({
 }
 
 // src/components/textarea/textarea.tsx
-import clsx39 from "clsx";
+import clsx38 from "clsx";
 import { jsx as jsx55, jsxs as jsxs42 } from "react/jsx-runtime";
 var resizeMap = {
   none: "resize-none",
@@ -8230,7 +8240,7 @@ function ITTextarea({
   maxLength,
   resize = "vertical"
 }) {
-  return /* @__PURE__ */ jsxs42("div", { className: clsx39("flex flex-col gap-1.5", className), children: [
+  return /* @__PURE__ */ jsxs42("div", { className: clsx38("flex flex-col gap-1.5", className), children: [
     label && /* @__PURE__ */ jsx55(ITText, { as: "label", className: inputLabel(!!error), htmlFor: name, children: label }),
     /* @__PURE__ */ jsx55(
       "textarea",
@@ -8243,7 +8253,7 @@ function ITTextarea({
         rows,
         disabled,
         maxLength,
-        className: clsx39(
+        className: clsx38(
           "w-full border border-solid transition-all duration-200 rounded-lg px-3 py-2 text-sm outline-none",
           "focus:ring-2",
           resizeMap[resize],
@@ -8257,7 +8267,7 @@ function ITTextarea({
 }
 
 // src/components/triple-filter/tripleFilter.tsx
-import clsx40 from "clsx";
+import clsx39 from "clsx";
 import { jsx as jsx56 } from "react/jsx-runtime";
 var colorMap2 = {
   primary: "text-primary-600",
@@ -8280,14 +8290,14 @@ var ITTripleFilter = ({
   return /* @__PURE__ */ jsx56(
     "div",
     {
-      className: clsx40("flex bg-slate-100 p-1 rounded-xl gap-1 w-fit", className),
+      className: clsx39("flex bg-slate-100 p-1 rounded-xl gap-1 w-fit", className),
       children: options.map((option) => /* @__PURE__ */ jsx56(
         "button",
         {
           onClick: () => onChange(option.value),
-          className: clsx40(
+          className: clsx39(
             "px-4 py-1.5 rounded-lg text-[10px] font-bold uppercase tracking-wider transition-all duration-200 whitespace-nowrap",
-            value === option.value ? clsx40("bg-white shadow-sm", colorMap2[color]) : "text-slate-400 hover:text-slate-600"
+            value === option.value ? clsx39("bg-white shadow-sm", colorMap2[color]) : "text-slate-400 hover:text-slate-600"
           ),
           children: /* @__PURE__ */ jsx56(ITText, { as: "span", children: option.label })
         },
@@ -8309,7 +8319,7 @@ var positionStyles = {
 };
 
 // src/components/toast/toast.tsx
-import clsx41 from "clsx";
+import clsx40 from "clsx";
 import { useEffect as useEffect16, useState as useState23 } from "react";
 import { FaTimesCircle as FaTimesCircle2, FaCheckCircle as FaCheckCircle2, FaExclamationTriangle as FaExclamationTriangle3, FaInfoCircle as FaInfoCircle2, FaTimes as FaTimes8 } from "react-icons/fa";
 import { jsx as jsx57, jsxs as jsxs43 } from "react/jsx-runtime";
@@ -8355,7 +8365,7 @@ function ITToast({
   return /* @__PURE__ */ jsxs43(
     "div",
     {
-      className: clsx41(
+      className: clsx40(
         "fixed z-50 p-4 rounded-xl shadow-xl flex items-center justify-between gap-4 transition-all duration-300 text-white min-w-[300px]",
         positionStyles[position],
         {
@@ -8389,7 +8399,7 @@ function ITToast({
 // src/components/dropfile/dropfile.tsx
 import { useState as useState24, useEffect as useEffect17, useRef as useRef13 } from "react";
 import { useDropzone } from "react-dropzone";
-import clsx42 from "clsx";
+import clsx41 from "clsx";
 import { Fragment as Fragment8, jsx as jsx58, jsxs as jsxs44 } from "react/jsx-runtime";
 var FileTypeEnum = /* @__PURE__ */ ((FileTypeEnum2) => {
   FileTypeEnum2["PDF"] = "application/pdf";
@@ -8594,7 +8604,7 @@ var ITDropfile = ({
     handleCancel();
   };
   const isImage = fileType && fileType.startsWith("image/");
-  return /* @__PURE__ */ jsxs44("div", { className: clsx42("w-full transition-all duration-300", containerClassName), children: [
+  return /* @__PURE__ */ jsxs44("div", { className: clsx41("w-full transition-all duration-300", containerClassName), children: [
     /* @__PURE__ */ jsxs44("div", { className: "flex items-center justify-between mb-2", children: [
       /* @__PURE__ */ jsxs44("label", { className: "block text-sm font-semibold text-gray-700", children: [
         /* @__PURE__ */ jsx58(ITText, { as: "span", children: "Subir archivo " }),
@@ -8638,7 +8648,7 @@ var ITDropfile = ({
           /* @__PURE__ */ jsx58(ITText, { as: "p", className: "text-[10px] text-gray-500", children: selectedFile ? (selectedFile.size / 1024 / 1024).toFixed(2) + " MB" : "" })
         ] })
       ] }) }),
-      /* @__PURE__ */ jsx58("div", { className: clsx42("relative bg-gray-100 flex items-center justify-center", !contentClassName ? "max-h-[200px] min-h-[100px] overflow-auto" : contentClassName), children: selectedFile && fileType?.startsWith("image/") || !selectedFile && imagePreview ? /* @__PURE__ */ jsx58(
+      /* @__PURE__ */ jsx58("div", { className: clsx41("relative bg-gray-100 flex items-center justify-center", !contentClassName ? "max-h-[200px] min-h-[100px] overflow-auto" : contentClassName), children: selectedFile && fileType?.startsWith("image/") || !selectedFile && imagePreview ? /* @__PURE__ */ jsx58(
         "img",
         {
           src: imagePreview,
@@ -8700,6 +8710,7 @@ var dropfile_default = ITDropfile;
 
 // src/components/layout/layout.tsx
 import { useState as useState26 } from "react";
+import clsx42 from "clsx";
 
 // src/components/topbar/topbar.tsx
 import { FaUserCircle as FaUserCircle2, FaBars } from "react-icons/fa";
@@ -8936,7 +8947,7 @@ function ITLayout({
           )
         }
       ),
-      /* @__PURE__ */ jsx60("main", { className: "flex-1 overflow-y-auto w-full custom-scrollbar relative z-0", children: /* @__PURE__ */ jsx60("div", { className: `mx-auto w-full h-full ${contentClassName}`, children }) })
+      /* @__PURE__ */ jsx60("main", { className: "flex-1 overflow-y-auto w-full custom-scrollbar relative z-0", children: /* @__PURE__ */ jsx60("div", { className: clsx42("mx-auto w-full max-w-7xl px-4 sm:px-6 lg:px-8 py-6 h-full", contentClassName), children }) })
     ] })
   ] });
 }