energy-components 1.8.0 → 1.9.0

package/dist/types/src/components/content/avatar/avatar.vue.d.ts

@@ -0,0 +1,153 @@
+type AvatarType = 'icon' | 'image' | 'initials';
+type AvatarSizeType = 's' | 'm' | 'l' | 'xl';
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /**
+     * Tipo de contenido para el avatar.
+     * <br>
+     * `['icon', 'image', 'initials']`
+     */
+    type: {
+        type: () => AvatarType;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    /**
+     * URL de la imagen a mostrar si el tipo es 'image'.
+     */
+    src: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Nombre del icono a mostrar si el tipo es 'icon'.
+     * Por defecto es 'user_default'.
+     */
+    iconName: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Texto de las iniciales a mostrar si el tipo es 'initials'.
+     * Se mostrarán como máximo los dos primeros caracteres en mayúsculas.
+     */
+    initials: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Indica si se debe mostrar un badge de notificación en el avatar.
+     */
+    badge: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Color de fondo del avatar.
+     * Puede ser un valor de color CSS válido (ej: '#333', 'rgb(255,0,0)', 'red') o una variable CSS.
+     * Por defecto es '#DBE6F0'.
+     */
+    backgroundColor: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Tamaño del avatar.
+     * <br>
+     * `'s'` (24px), `'m'` (32px), `'l'` (40px), `'xl'` (48px)
+     * Por defecto es 'l'.
+     */
+    size: {
+        type: () => AvatarSizeType;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    /**
+     * Texto alternativo para la imagen del avatar (usado para accesibilidad si el tipo es 'image').
+     */
+    alt: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    click: (event: KeyboardEvent | MouseEvent) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * Tipo de contenido para el avatar.
+     * <br>
+     * `['icon', 'image', 'initials']`
+     */
+    type: {
+        type: () => AvatarType;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    /**
+     * URL de la imagen a mostrar si el tipo es 'image'.
+     */
+    src: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Nombre del icono a mostrar si el tipo es 'icon'.
+     * Por defecto es 'user_default'.
+     */
+    iconName: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Texto de las iniciales a mostrar si el tipo es 'initials'.
+     * Se mostrarán como máximo los dos primeros caracteres en mayúsculas.
+     */
+    initials: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Indica si se debe mostrar un badge de notificación en el avatar.
+     */
+    badge: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Color de fondo del avatar.
+     * Puede ser un valor de color CSS válido (ej: '#333', 'rgb(255,0,0)', 'red') o una variable CSS.
+     * Por defecto es '#DBE6F0'.
+     */
+    backgroundColor: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Tamaño del avatar.
+     * <br>
+     * `'s'` (24px), `'m'` (32px), `'l'` (40px), `'xl'` (48px)
+     * Por defecto es 'l'.
+     */
+    size: {
+        type: () => AvatarSizeType;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    /**
+     * Texto alternativo para la imagen del avatar (usado para accesibilidad si el tipo es 'image').
+     */
+    alt: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{
+    onClick?: ((event: KeyboardEvent | MouseEvent) => any) | undefined;
+}>, {
+    size: AvatarSizeType;
+    type: AvatarType;
+    initials: string;
+    src: string;
+    iconName: string;
+    badge: boolean;
+    backgroundColor: string;
+    alt: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/types/src/components/feedback/loader/loader.vue.d.ts

@@ -0,0 +1,151 @@
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /**
+     * Define el diámetro del loader en píxeles.
+     * El valor se ajustará para estar entre 32px (mínimo) y 120px (máximo).
+     *
+     * @type {number}
+     * @optional
+     */
+    size: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * Especifica la variante del loader.
+     * 'default': Muestra solo el spinner.
+     * 'contained': Envuelve el spinner en un contenedor con estilo de tarjeta (104x104px con padding de 24px).
+     * El prop `size` afectará al spinner dentro de este contenedor.
+     *
+     * @type {string}
+     * @optional
+     */
+    variant: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: unknown) => boolean;
+    };
+    /**
+     * Controla el tipo de animación del loader.
+     * 'normal': Una rotación continua de un arco del círculo.
+     * 'infinite': Una animación donde un segmento del círculo parece crecer, encogerse y rotar.
+     *
+     * @type {string}
+     * @optional
+     */
+    animationType: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: unknown) => boolean;
+    };
+    /**
+     * Define el grosor del trazo del spinner en píxeles.
+     * Si no se especifica, se calcula automáticamente como `size / 8` (con un mínimo de 2px).
+     *
+     * @type {number}
+     * @optional
+     */
+    strokeWidth: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * Etiqueta ARIA para accesibilidad. Describe la acción que se está realizando.
+     *
+     * @type {string}
+     * @optional
+     */
+    ariaLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Identificador único para el componente y sus elementos internos (como el gradiente SVG).
+     * Si no se proporciona, se usará un valor por defecto.
+     *
+     * @type {string}
+     * @optional
+     */
+    id: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * Define el diámetro del loader en píxeles.
+     * El valor se ajustará para estar entre 32px (mínimo) y 120px (máximo).
+     *
+     * @type {number}
+     * @optional
+     */
+    size: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * Especifica la variante del loader.
+     * 'default': Muestra solo el spinner.
+     * 'contained': Envuelve el spinner en un contenedor con estilo de tarjeta (104x104px con padding de 24px).
+     * El prop `size` afectará al spinner dentro de este contenedor.
+     *
+     * @type {string}
+     * @optional
+     */
+    variant: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: unknown) => boolean;
+    };
+    /**
+     * Controla el tipo de animación del loader.
+     * 'normal': Una rotación continua de un arco del círculo.
+     * 'infinite': Una animación donde un segmento del círculo parece crecer, encogerse y rotar.
+     *
+     * @type {string}
+     * @optional
+     */
+    animationType: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: unknown) => boolean;
+    };
+    /**
+     * Define el grosor del trazo del spinner en píxeles.
+     * Si no se especifica, se calcula automáticamente como `size / 8` (con un mínimo de 2px).
+     *
+     * @type {number}
+     * @optional
+     */
+    strokeWidth: {
+        type: NumberConstructor;
+        default: number;
+    };
+    /**
+     * Etiqueta ARIA para accesibilidad. Describe la acción que se está realizando.
+     *
+     * @type {string}
+     * @optional
+     */
+    ariaLabel: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Identificador único para el componente y sus elementos internos (como el gradiente SVG).
+     * Si no se proporciona, se usará un valor por defecto.
+     *
+     * @type {string}
+     * @optional
+     */
+    id: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    size: number;
+    variant: string;
+    id: string;
+    ariaLabel: string;
+    animationType: string;
+    strokeWidth: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/types/src/components/feedback/progress-bar/progress-bar.vue.d.ts

@@ -47,6 +47,22 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         type: BooleanConstructor;
         default: boolean;
     };
+    /**
+     * Si es true, oculta completamente el contador de pasos y solo muestra la barra de progreso.
+     * Útil para barras de progreso sencillas en componentes con espacio limitado.
+     */
+    hideCounter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Indica el color de fondo de la bara principal.
+     * si el whiteBar esta true = $rds-color-neutral-white
+     */
+    whiteBar: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     goBack: () => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@@ -85,12 +101,30 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         type: BooleanConstructor;
         default: boolean;
     };
+    /**
+     * Si es true, oculta completamente el contador de pasos y solo muestra la barra de progreso.
+     * Útil para barras de progreso sencillas en componentes con espacio limitado.
+     */
+    hideCounter: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Indica el color de fondo de la bara principal.
+     * si el whiteBar esta true = $rds-color-neutral-white
+     */
+    whiteBar: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{
     onGoBack?: (() => any) | undefined;
 }>, {
     inverse: boolean;
     backButton: boolean;
     percentage: boolean;
+    hideCounter: boolean;
+    whiteBar: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/types/src/components/index.d.ts

@@ -15,20 +15,24 @@ export { default as RDSToggle } from './input/toggle/toggle.vue';
 export { default as RDSSelectionChip } from './input/selection-chip/selection-chip.vue';
 export { default as RDSFilterChip } from './input/filter-chip/filter-chip.vue';
 export { default as RDSDragAndDrop } from './input/drag-and-drop/drag-and-drop.vue';
+export { default as RDSFileUploadItem } from './input/file-upload-item/file-upload-item.vue';
 export { default as RDSTag } from './content/tag/tag.vue';
 export { default as RDSAccordionGroup } from './content/acordion-group/accordion-group.vue';
 export { default as RDSAccordion } from './content/accordion/accordion.vue';
 export { default as RDSDivider } from './content/divider/divider.vue';
 export { default as RDSCard } from './content/card/card.vue';
 export { default as RDSTable } from './content/table/table-paginated/TablePaginatedComponent.vue';
+export { default as RDSAvatar } from './content/avatar/avatar.vue';
 export { default as RDSLink } from './navigation/link/link.vue';
 export { default as RDSBreadcrumbs } from './navigation/breadcrumbs/breadcrumbs.vue';
 export { default as RDSTabBar } from './navigation/tab-bar/tab-bar.vue';
 export { default as RDSPagination } from './navigation/pagination/pagination.vue';
+export { default as RDSDirectAccess } from './navigation/direct-access/direct-access.vue';
 export { default as RDSIndicator } from './feedback/indicator/indicator.vue';
 export { default as RDSPersistentToast } from './feedback/persistent-toast/persistent-toast.vue';
 export { default as RDSInfoBox } from './feedback/info-box/info-box.vue';
 export { default as RDSProgressBar } from './feedback/progress-bar/progress-bar.vue';
+export { default as RDSLoader } from './feedback/loader/loader.vue';
 export { default as RDSModal } from './overlay/modal/modal.vue';
 export { default as RDSOverlay } from './overlay/overlay/overlay.vue';
 export { default as RDSTooltip } from './overlay/tooltip/tooltip.vue';

package/dist/types/src/components/input/checkbox/checkbox.vue.d.ts

@@ -59,6 +59,13 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         type: BooleanConstructor;
         default: boolean;
     };
+    /**
+     * <span>Estado "indeterminado" visual del checkbox. Solo afecta si está checked.</span>
+     */
+    indeterminate: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     "update:modelValue": (event: boolean) => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@@ -118,6 +125,13 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         type: BooleanConstructor;
         default: boolean;
     };
+    /**
+     * <span>Estado "indeterminado" visual del checkbox. Solo afecta si está checked.</span>
+     */
+    indeterminate: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{
     "onUpdate:modelValue"?: ((event: boolean) => any) | undefined;
 }>, {
@@ -129,6 +143,7 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
     id: string | number;
     accessibilityLabel: string;
     isChecked: boolean;
+    indeterminate: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
 export default _default;

package/dist/types/src/components/input/drag-and-drop/drag-and-drop.vue.d.ts

@@ -90,8 +90,14 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         default: boolean;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    error: (message: string) => any;
     filesSelected: (files: FileList) => any;
+    validationError: (message: string) => any;
+    fileReady: (payload: {
+        id: string;
+        file: File;
+        name: string;
+        size: number;
+    }) => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     /**
      * Tipos de archivo aceptados por el input (ej. '.png,.jpg,.pdf', 'image/*').
@@ -179,8 +185,14 @@ declare const __VLS_component: import("vue").DefineComponent<import("vue").Extra
         default: boolean;
     };
 }>> & Readonly<{
-    onError?: ((message: string) => any) | undefined;
     onFilesSelected?: ((files: FileList) => any) | undefined;
+    onValidationError?: ((message: string) => any) | undefined;
+    onFileReady?: ((payload: {
+        id: string;
+        file: File;
+        name: string;
+        size: number;
+    }) => any) | undefined;
 }>, {
     error: boolean;
     icon: string;

package/dist/types/src/components/input/file-upload-item/file-upload-item.vue.d.ts

@@ -0,0 +1,229 @@
+import type { PropType } from 'vue';
+interface FileAction {
+    type: string;
+    icon: string;
+    label?: string;
+}
+type FileStatus = 'default' | 'uploading' | 'error' | 'disabled';
+declare var __VLS_1: {}, __VLS_9: {};
+type __VLS_Slots = {} & {
+    'file-icon'?: (props: typeof __VLS_1) => any;
+} & {
+    action?: (props: typeof __VLS_9) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    /**
+     * Identificador único para el ítem de archivo (opcional, pero útil para eventos).
+     */
+    id: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Nombre del archivo a mostrar.
+     */
+    fileName: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * Tamaño del archivo en bytes.
+     */
+    fileSize: {
+        type: NumberConstructor;
+        required: true;
+    };
+    /**
+     * Nombre del icono a mostrar para el archivo.
+     * Ver la sección 'Options > Icon' en el diseño para ejemplos.
+     * Por defecto es 'document_generic' (representando "Document final content").
+     */
+    fileIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Estado actual del ítem de archivo.
+     * Determina la apariencia y elementos mostrados (ej. barra de progreso, mensaje de error).
+     * Posibles valores: 'default', 'uploading', 'error', 'disabled'.
+     */
+    status: {
+        type: PropType<FileStatus>;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    /**
+     * Progreso de la subida (0-100). Usado por RDSProgressBar si showProgressBar es true.
+     */
+    progress: {
+        type: NumberConstructor;
+        default: number;
+        validator: (value: number) => boolean;
+    };
+    /**
+     * Texto que indica el tiempo restante de subida (ej. "4 second left").
+     * Solo visible si status es 'uploading'.
+     */
+    timeRemaining: {
+        type: StringConstructor;
+        default: null;
+    };
+    /**
+     * Mensaje de error a mostrar. Solo visible si status es 'error'.
+     * Reemplaza el campo de detalle con el contexto de error.
+     */
+    errorMessage: {
+        type: StringConstructor;
+        default: null;
+    };
+    /**
+     * Indica si el componente está deshabilitado.
+     * Esto aplicará estilos de deshabilitado y prevendrá interacciones.
+     */
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Define la acción disponible para el ítem.
+     * Por defecto es una acción de eliminar.
+     * Ejemplo: { type: 'delete', icon: 'delete', label: 'Eliminar archivo' }
+     */
+    action: {
+        type: PropType<FileAction>;
+        default: () => {
+            type: string;
+            icon: string;
+            label: string;
+        };
+    };
+    /**
+     * Indica si se debe mostrar el componente RDSProgressBar durante el estado 'uploading'.
+     * Si es false, no se muestra ninguna barra de progreso.
+     */
+    showProgressBar: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    action: (payload: {
+        actionType: string;
+        fileId: string;
+    }) => any;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * Identificador único para el ítem de archivo (opcional, pero útil para eventos).
+     */
+    id: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Nombre del archivo a mostrar.
+     */
+    fileName: {
+        type: StringConstructor;
+        required: true;
+    };
+    /**
+     * Tamaño del archivo en bytes.
+     */
+    fileSize: {
+        type: NumberConstructor;
+        required: true;
+    };
+    /**
+     * Nombre del icono a mostrar para el archivo.
+     * Ver la sección 'Options > Icon' en el diseño para ejemplos.
+     * Por defecto es 'document_generic' (representando "Document final content").
+     */
+    fileIcon: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * Estado actual del ítem de archivo.
+     * Determina la apariencia y elementos mostrados (ej. barra de progreso, mensaje de error).
+     * Posibles valores: 'default', 'uploading', 'error', 'disabled'.
+     */
+    status: {
+        type: PropType<FileStatus>;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+    /**
+     * Progreso de la subida (0-100). Usado por RDSProgressBar si showProgressBar es true.
+     */
+    progress: {
+        type: NumberConstructor;
+        default: number;
+        validator: (value: number) => boolean;
+    };
+    /**
+     * Texto que indica el tiempo restante de subida (ej. "4 second left").
+     * Solo visible si status es 'uploading'.
+     */
+    timeRemaining: {
+        type: StringConstructor;
+        default: null;
+    };
+    /**
+     * Mensaje de error a mostrar. Solo visible si status es 'error'.
+     * Reemplaza el campo de detalle con el contexto de error.
+     */
+    errorMessage: {
+        type: StringConstructor;
+        default: null;
+    };
+    /**
+     * Indica si el componente está deshabilitado.
+     * Esto aplicará estilos de deshabilitado y prevendrá interacciones.
+     */
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    /**
+     * Define la acción disponible para el ítem.
+     * Por defecto es una acción de eliminar.
+     * Ejemplo: { type: 'delete', icon: 'delete', label: 'Eliminar archivo' }
+     */
+    action: {
+        type: PropType<FileAction>;
+        default: () => {
+            type: string;
+            icon: string;
+            label: string;
+        };
+    };
+    /**
+     * Indica si se debe mostrar el componente RDSProgressBar durante el estado 'uploading'.
+     * Si es false, no se muestra ninguna barra de progreso.
+     */
+    showProgressBar: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{
+    onAction?: ((payload: {
+        actionType: string;
+        fileId: string;
+    }) => any) | undefined;
+}>, {
+    progress: number;
+    disabled: boolean;
+    id: string;
+    errorMessage: string;
+    fileIcon: string;
+    status: FileStatus;
+    timeRemaining: string;
+    action: FileAction;
+    showProgressBar: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/types/src/components/input/filter-chip/filter-chip.vue.d.ts

@@ -22,6 +22,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     leftNumber: {
         type: StringConstructor;
         default: string;
+        validator: (value: string) => boolean;
     };
     /**
      * <span>Indica si se muestra el icono de flecha a la derecha</span>
@@ -91,6 +92,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     leftNumber: {
         type: StringConstructor;
         default: string;
+        validator: (value: string) => boolean;
     };
     /**
      * <span>Indica si se muestra el icono de flecha a la derecha</span>