@axzydev/axzy_ui_system 1.0.167 → 1.0.169

package/dist/index.d.cts

@@ -185,6 +185,7 @@ interface ITCalendarProps {
     maxDate?: Date;
     className?: string;
     disabled?: boolean;
+    variant?: ColorsTypes;
 }
 
 declare const ITCalendar: React__default.FC<ITCalendarProps>;
@@ -333,7 +334,7 @@ interface ITDatePickerProps {
     label?: string;
     required?: boolean;
     touched?: boolean;
-    error?: string;
+    error?: string | boolean;
     minDate?: Date;
     maxDate?: Date;
 }
@@ -470,7 +471,7 @@ interface ITInputProps {
     placeholder?: string;
     value?: any;
     onChange: (event: any) => void;
-    onBlur: (event: React.FocusEvent<HTMLInputElement> | React.FocusEvent<HTMLTextAreaElement, Element>) => void;
+    onBlur?: (event: React.FocusEvent<HTMLInputElement> | React.FocusEvent<HTMLTextAreaElement, Element>) => void;
     showHintLength?: boolean;
     maxLength?: number;
     minLength?: number;
@@ -481,7 +482,7 @@ interface ITInputProps {
     labelClassName?: string;
     className?: string;
     touched?: boolean;
-    error?: string;
+    error?: string | boolean;
     required?: boolean;
     formatNumber?: boolean;
     autoFocus?: boolean;
@@ -599,7 +600,7 @@ interface ITSelectProps {
     disabled?: boolean;
     className?: string;
     touched?: boolean;
-    error?: string;
+    error?: string | boolean;
     required?: boolean;
     autoFocus?: boolean;
     readOnly?: boolean;
@@ -644,7 +645,7 @@ interface ITSearchSelectProps {
     /** Indica si el campo es requerido */
     required?: boolean;
     /** Mensaje de error */
-    error?: string;
+    error?: string | boolean;
     /** Indica si el campo es de solo lectura */
     readOnly?: boolean;
     /** Callback para búsqueda en servidor (Modo 2: Conexión con API) */
@@ -817,7 +818,7 @@ interface ITTopBarProps {
 interface ITNavigationSubItem {
     id: string;
     label: string;
-    action: () => void;
+    action?: () => void;
     isActive?: boolean;
 }
 interface ITNavigationItem {
@@ -836,6 +837,7 @@ interface ITSidebarProps {
     visibleOnMobile?: boolean;
     onItemClick?: (item: ITNavigationItem) => void;
     onSubItemClick?: (subitem: ITNavigationSubItem) => void;
+    subitemConnector?: 'lines' | 'dots' | '|' | 'none';
     className?: string;
 }
 
@@ -889,6 +891,71 @@ interface ITStepperProps {
 
 declare function ITStepper({ steps, currentStep, onFinish, onStepChange, allowClickToJump, useIcons, disableNext, containerClassName, stepClassName, scrollableContent, maxContentHeight, color, }: ITStepperProps): react_jsx_runtime.JSX.Element;
 
+interface ITThemePalette {
+    primary: string;
+    secondary: string;
+    ternary: string;
+    danger: string;
+    success: string;
+    info: string;
+    alert: string;
+    warning: string;
+    layout: {
+        sidebarBg: string;
+        sidebarText: string;
+        navbarBg: string;
+        navbarText: string;
+    };
+    table: {
+        headerBg: string;
+        headerText: string;
+        rowBg: string;
+        rowText: string;
+    };
+}
+interface ITThemeProviderProps {
+    theme?: Partial<ITThemePalette>;
+    children: React.ReactNode;
+}
+
+interface ITThemeContextType {
+    palette: ITThemePalette;
+    colors: ITThemePalette;
+    setPalette: (newPalette: ITThemePalette) => void;
+    updateColor: (key: string, value: string) => void;
+    resetTheme: () => void;
+    applyPreset: (colors: ITThemePalette) => void;
+    resolvedTheme: "light" | "dark";
+    darkModeMode: "light" | "dark" | "system";
+    setDarkModeMode: (mode: "light" | "dark" | "system") => void;
+}
+declare const useITTheme: () => ITThemeContextType;
+/**
+ * Versión segura de useITTheme que retorna undefined
+ * si se usa fuera de ITThemeProvider (no lanza error).
+ */
+declare const useITThemeSafe: () => ITThemeContextType | undefined;
+declare function ITThemeProvider({ children, theme }: ITThemeProviderProps): react_jsx_runtime.JSX.Element;
+
+interface ITTimePickerProps {
+    name: string;
+    value?: string;
+    label?: string;
+    placeholder?: string;
+    onChange: (e: any) => void;
+    onBlur?: (e: any) => void;
+    required?: boolean;
+    touched?: boolean;
+    error?: string | boolean;
+    disabled?: boolean;
+    className?: string;
+    size?: "small" | "medium" | "large";
+    variant?: "primary" | "secondary" | "danger" | "success" | "warning" | "info" | "purple";
+    color?: "primary" | "secondary" | "danger" | "success" | "warning" | "info" | "purple" | string;
+}
+
+declare function ITTimePicker({ name, value, label, placeholder, onChange, onBlur, required, touched, error, disabled, className, size, variant, color, }: ITTimePickerProps): react_jsx_runtime.JSX.Element;
+
 type ColorScale = {
     50: string;
     100: string;
@@ -984,36 +1051,23 @@ interface ITThemeConfig {
     };
 }
 
-interface ITThemeProviderProps {
-    theme?: Partial<ITThemeConfig>;
-    children: React.ReactNode;
-}
-
-declare function ITThemeProvider({ theme, children }: ITThemeProviderProps): react_jsx_runtime.JSX.Element;
-
-interface ITTimePickerProps {
-    name: string;
-    value?: string;
-    label?: string;
-    placeholder?: string;
-    onChange: (e: any) => void;
-    onBlur: (e: any) => void;
-    required?: boolean;
-    touched?: boolean;
-    error?: string | boolean;
-    disabled?: boolean;
-    className?: string;
-    size?: "small" | "medium" | "large";
-    variant?: "primary" | "secondary" | "danger" | "success" | "warning" | "info" | "purple";
-    color?: "primary" | "secondary" | "danger" | "success" | "warning" | "info" | "purple" | string;
-}
-
-declare function ITTimePicker({ name, value, label, placeholder, onChange, onBlur, required, touched, error, disabled, className, size, variant, color, }: ITTimePickerProps): react_jsx_runtime.JSX.Element;
-
 declare const createValidationSchema: (fields: FieldConfig[]) => Yup.ObjectSchema<{
     [x: string]: never;
 }, Yup.AnyObject, {
     [x: string]: any;
 }, "">;
 
-export { type Column, type FieldConfig, type FieldConfigV2, ITBadget, type ITBadgetProps, ITButton, type ITButtonProps, ITCalendar, type ITCalendarProps, ITCard, type ITCardProps, ITDataTable, type ITDataTableFetchParams, type ITDataTableProps, type ITDataTableResponse, ITDatePicker, type ITDatePickerProps, ITDialog, type ITDialogProps, ITDropfile, ITFormBuilder, type ITFormBuilderProps, ITImage, ITInput, type ITInputProps, ITLayout, type ITLayoutProps, ITLoader, ITNavbar, type ITNavbarProps, ITPagination, ITSearchSelect, type ITSearchSelectProps, ITSelect, type ITSelectProps, ITSlideToggle, type ITSlideToggleProps, ITStepper, type ITTabItem, ITTable, type ITTableProps, ITTabs, type ITTabsProps, ITText, type ITThemeConfig, ITThemeProvider, type ITThemeProviderProps, ITTimePicker, type ITTimePickerProps, ITToast, type ITToastProps, ITTripleFilter, type ITTripleFilterOption, type ITTripleFilterProps, createValidationSchema };
+/**
+ * Determina si un color hexadecimal es claro.
+ */
+declare const isLightColor: (hex: string) => boolean;
+/**
+ * Traduce un valor de color de CSS (hexadecimal o variable var(--...)) a hexadecimal absoluto.
+ */
+declare const resolveCssColor: (colorStr: string, palette?: ITThemePalette, isDarkMode?: boolean) => string;
+/**
+ * Obtiene la clase de color de texto óptima (blanca o gris oscuro) basado en el fondo.
+ */
+declare const getContrastTextColor: (bgColor: string, palette?: ITThemePalette, isDarkMode?: boolean) => "text-white" | "text-slate-800";
+
+export { type Column, type FieldConfig, type FieldConfigV2, FileTypeEnum, ITBadget, type ITBadgetProps, ITButton, type ITButtonProps, ITCalendar, type ITCalendarProps, ITCard, type ITCardProps, ITDataTable, type ITDataTableFetchParams, type ITDataTableProps, type ITDataTableResponse, ITDatePicker, type ITDatePickerProps, ITDialog, type ITDialogProps, ITDropfile, ITFormBuilder, type ITFormBuilderProps, ITImage, ITInput, type ITInputProps, ITLayout, type ITLayoutProps, ITLoader, ITNavbar, type ITNavbarProps, ITPagination, ITSearchSelect, type ITSearchSelectProps, ITSelect, type ITSelectProps, ITSlideToggle, type ITSlideToggleProps, ITStepper, type ITTabItem, ITTable, type ITTableProps, ITTabs, type ITTabsProps, ITText, type ITThemeConfig, type ITThemePalette, ITThemeProvider, type ITThemeProviderProps, ITTimePicker, type ITTimePickerProps, ITToast, type ITToastProps, ITTripleFilter, type ITTripleFilterOption, type ITTripleFilterProps, UploadStatus, createValidationSchema, getContrastTextColor, isLightColor, resolveCssColor, useITTheme, useITThemeSafe };

package/dist/index.d.ts

@@ -185,6 +185,7 @@ interface ITCalendarProps {
     maxDate?: Date;
     className?: string;
     disabled?: boolean;
+    variant?: ColorsTypes;
 }
 
 declare const ITCalendar: React__default.FC<ITCalendarProps>;
@@ -333,7 +334,7 @@ interface ITDatePickerProps {
     label?: string;
     required?: boolean;
     touched?: boolean;
-    error?: string;
+    error?: string | boolean;
     minDate?: Date;
     maxDate?: Date;
 }
@@ -470,7 +471,7 @@ interface ITInputProps {
     placeholder?: string;
     value?: any;
     onChange: (event: any) => void;
-    onBlur: (event: React.FocusEvent<HTMLInputElement> | React.FocusEvent<HTMLTextAreaElement, Element>) => void;
+    onBlur?: (event: React.FocusEvent<HTMLInputElement> | React.FocusEvent<HTMLTextAreaElement, Element>) => void;
     showHintLength?: boolean;
     maxLength?: number;
     minLength?: number;
@@ -481,7 +482,7 @@ interface ITInputProps {
     labelClassName?: string;
     className?: string;
     touched?: boolean;
-    error?: string;
+    error?: string | boolean;
     required?: boolean;
     formatNumber?: boolean;
     autoFocus?: boolean;
@@ -599,7 +600,7 @@ interface ITSelectProps {
     disabled?: boolean;
     className?: string;
     touched?: boolean;
-    error?: string;
+    error?: string | boolean;
     required?: boolean;
     autoFocus?: boolean;
     readOnly?: boolean;
@@ -644,7 +645,7 @@ interface ITSearchSelectProps {
     /** Indica si el campo es requerido */
     required?: boolean;
     /** Mensaje de error */
-    error?: string;
+    error?: string | boolean;
     /** Indica si el campo es de solo lectura */
     readOnly?: boolean;
     /** Callback para búsqueda en servidor (Modo 2: Conexión con API) */
@@ -817,7 +818,7 @@ interface ITTopBarProps {
 interface ITNavigationSubItem {
     id: string;
     label: string;
-    action: () => void;
+    action?: () => void;
     isActive?: boolean;
 }
 interface ITNavigationItem {
@@ -836,6 +837,7 @@ interface ITSidebarProps {
     visibleOnMobile?: boolean;
     onItemClick?: (item: ITNavigationItem) => void;
     onSubItemClick?: (subitem: ITNavigationSubItem) => void;
+    subitemConnector?: 'lines' | 'dots' | '|' | 'none';
     className?: string;
 }
 
@@ -889,6 +891,71 @@ interface ITStepperProps {
 
 declare function ITStepper({ steps, currentStep, onFinish, onStepChange, allowClickToJump, useIcons, disableNext, containerClassName, stepClassName, scrollableContent, maxContentHeight, color, }: ITStepperProps): react_jsx_runtime.JSX.Element;
 
+interface ITThemePalette {
+    primary: string;
+    secondary: string;
+    ternary: string;
+    danger: string;
+    success: string;
+    info: string;
+    alert: string;
+    warning: string;
+    layout: {
+        sidebarBg: string;
+        sidebarText: string;
+        navbarBg: string;
+        navbarText: string;
+    };
+    table: {
+        headerBg: string;
+        headerText: string;
+        rowBg: string;
+        rowText: string;
+    };
+}
+interface ITThemeProviderProps {
+    theme?: Partial<ITThemePalette>;
+    children: React.ReactNode;
+}
+
+interface ITThemeContextType {
+    palette: ITThemePalette;
+    colors: ITThemePalette;
+    setPalette: (newPalette: ITThemePalette) => void;
+    updateColor: (key: string, value: string) => void;
+    resetTheme: () => void;
+    applyPreset: (colors: ITThemePalette) => void;
+    resolvedTheme: "light" | "dark";
+    darkModeMode: "light" | "dark" | "system";
+    setDarkModeMode: (mode: "light" | "dark" | "system") => void;
+}
+declare const useITTheme: () => ITThemeContextType;
+/**
+ * Versión segura de useITTheme que retorna undefined
+ * si se usa fuera de ITThemeProvider (no lanza error).
+ */
+declare const useITThemeSafe: () => ITThemeContextType | undefined;
+declare function ITThemeProvider({ children, theme }: ITThemeProviderProps): react_jsx_runtime.JSX.Element;
+
+interface ITTimePickerProps {
+    name: string;
+    value?: string;
+    label?: string;
+    placeholder?: string;
+    onChange: (e: any) => void;
+    onBlur?: (e: any) => void;
+    required?: boolean;
+    touched?: boolean;
+    error?: string | boolean;
+    disabled?: boolean;
+    className?: string;
+    size?: "small" | "medium" | "large";
+    variant?: "primary" | "secondary" | "danger" | "success" | "warning" | "info" | "purple";
+    color?: "primary" | "secondary" | "danger" | "success" | "warning" | "info" | "purple" | string;
+}
+
+declare function ITTimePicker({ name, value, label, placeholder, onChange, onBlur, required, touched, error, disabled, className, size, variant, color, }: ITTimePickerProps): react_jsx_runtime.JSX.Element;
+
 type ColorScale = {
     50: string;
     100: string;
@@ -984,36 +1051,23 @@ interface ITThemeConfig {
     };
 }
 
-interface ITThemeProviderProps {
-    theme?: Partial<ITThemeConfig>;
-    children: React.ReactNode;
-}
-
-declare function ITThemeProvider({ theme, children }: ITThemeProviderProps): react_jsx_runtime.JSX.Element;
-
-interface ITTimePickerProps {
-    name: string;
-    value?: string;
-    label?: string;
-    placeholder?: string;
-    onChange: (e: any) => void;
-    onBlur: (e: any) => void;
-    required?: boolean;
-    touched?: boolean;
-    error?: string | boolean;
-    disabled?: boolean;
-    className?: string;
-    size?: "small" | "medium" | "large";
-    variant?: "primary" | "secondary" | "danger" | "success" | "warning" | "info" | "purple";
-    color?: "primary" | "secondary" | "danger" | "success" | "warning" | "info" | "purple" | string;
-}
-
-declare function ITTimePicker({ name, value, label, placeholder, onChange, onBlur, required, touched, error, disabled, className, size, variant, color, }: ITTimePickerProps): react_jsx_runtime.JSX.Element;
-
 declare const createValidationSchema: (fields: FieldConfig[]) => Yup.ObjectSchema<{
     [x: string]: never;
 }, Yup.AnyObject, {
     [x: string]: any;
 }, "">;
 
-export { type Column, type FieldConfig, type FieldConfigV2, ITBadget, type ITBadgetProps, ITButton, type ITButtonProps, ITCalendar, type ITCalendarProps, ITCard, type ITCardProps, ITDataTable, type ITDataTableFetchParams, type ITDataTableProps, type ITDataTableResponse, ITDatePicker, type ITDatePickerProps, ITDialog, type ITDialogProps, ITDropfile, ITFormBuilder, type ITFormBuilderProps, ITImage, ITInput, type ITInputProps, ITLayout, type ITLayoutProps, ITLoader, ITNavbar, type ITNavbarProps, ITPagination, ITSearchSelect, type ITSearchSelectProps, ITSelect, type ITSelectProps, ITSlideToggle, type ITSlideToggleProps, ITStepper, type ITTabItem, ITTable, type ITTableProps, ITTabs, type ITTabsProps, ITText, type ITThemeConfig, ITThemeProvider, type ITThemeProviderProps, ITTimePicker, type ITTimePickerProps, ITToast, type ITToastProps, ITTripleFilter, type ITTripleFilterOption, type ITTripleFilterProps, createValidationSchema };
+/**
+ * Determina si un color hexadecimal es claro.
+ */
+declare const isLightColor: (hex: string) => boolean;
+/**
+ * Traduce un valor de color de CSS (hexadecimal o variable var(--...)) a hexadecimal absoluto.
+ */
+declare const resolveCssColor: (colorStr: string, palette?: ITThemePalette, isDarkMode?: boolean) => string;
+/**
+ * Obtiene la clase de color de texto óptima (blanca o gris oscuro) basado en el fondo.
+ */
+declare const getContrastTextColor: (bgColor: string, palette?: ITThemePalette, isDarkMode?: boolean) => "text-white" | "text-slate-800";
+
+export { type Column, type FieldConfig, type FieldConfigV2, FileTypeEnum, ITBadget, type ITBadgetProps, ITButton, type ITButtonProps, ITCalendar, type ITCalendarProps, ITCard, type ITCardProps, ITDataTable, type ITDataTableFetchParams, type ITDataTableProps, type ITDataTableResponse, ITDatePicker, type ITDatePickerProps, ITDialog, type ITDialogProps, ITDropfile, ITFormBuilder, type ITFormBuilderProps, ITImage, ITInput, type ITInputProps, ITLayout, type ITLayoutProps, ITLoader, ITNavbar, type ITNavbarProps, ITPagination, ITSearchSelect, type ITSearchSelectProps, ITSelect, type ITSelectProps, ITSlideToggle, type ITSlideToggleProps, ITStepper, type ITTabItem, ITTable, type ITTableProps, ITTabs, type ITTabsProps, ITText, type ITThemeConfig, type ITThemePalette, ITThemeProvider, type ITThemeProviderProps, ITTimePicker, type ITTimePickerProps, ITToast, type ITToastProps, ITTripleFilter, type ITTripleFilterOption, type ITTripleFilterProps, UploadStatus, createValidationSchema, getContrastTextColor, isLightColor, resolveCssColor, useITTheme, useITThemeSafe };