@dropi/ui 0.1.17 → 0.1.19

package/dist/types/components.d.ts

@@ -5,30 +5,52 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
+import { AlertState, AlertType } from "./components/dropi-alert/dropi-alert";
+import { AvatarType } from "./components/dropi-avatars/dropi-avatars";
 import { BadgeState } from "./components/dropi-badge/dropi-badge";
 import { ButtonSeverity, ButtonSize, ButtonState, ButtonType } from "./components/dropi-button/dropi-button";
+import { CheckboxOption } from "./components/dropi-checkbox-selection-list/dropi-checkbox-selection-list";
+import { ChipStyle, ChipType } from "./components/dropi-chips/dropi-chips";
+import { DropdownOption } from "./components/dropi-dropdown/dropi-dropdown";
 import { InputMode } from "./components/dropi-input/dropi-input";
 import { ModalPosition, ModalSize } from "./components/dropi-modal/dropi-modal";
 import { Event } from "./stencil-public-runtime";
+import { RadioOption } from "./components/dropi-radio-selection-list/dropi-radio-selection-list";
+import { SearchOption } from "./components/dropi-search/dropi-search";
 import { SelectOption, SelectOptionGroup } from "./components/dropi-select/select.types";
+import { FlowMode, StepperType } from "./components/dropi-simple-stepper/dropi-simple-stepper";
 import { SkeletonVariant } from "./components/dropi-skeleton/dropi-skeleton";
+import { StepLabel } from "./components/dropi-steps/dropi-steps";
 import { TabItem } from "./components/dropi-tabs/dropi-tabs";
 import { TagState, TagType } from "./components/dropi-tag/dropi-tag";
 import { ResizeMode } from "./components/dropi-text-area/dropi-text-area";
+import { TimelineStep } from "./components/dropi-time-line/dropi-time-line";
 import { ToastMessage } from "./components/dropi-toast/dropi-toast";
 import { TooltipPosition } from "./components/dropi-tooltip/dropi-tooltip";
+import { VerticalStep } from "./components/dropi-vertical-steps/dropi-vertical-steps";
+export { AlertState, AlertType } from "./components/dropi-alert/dropi-alert";
+export { AvatarType } from "./components/dropi-avatars/dropi-avatars";
 export { BadgeState } from "./components/dropi-badge/dropi-badge";
 export { ButtonSeverity, ButtonSize, ButtonState, ButtonType } from "./components/dropi-button/dropi-button";
+export { CheckboxOption } from "./components/dropi-checkbox-selection-list/dropi-checkbox-selection-list";
+export { ChipStyle, ChipType } from "./components/dropi-chips/dropi-chips";
+export { DropdownOption } from "./components/dropi-dropdown/dropi-dropdown";
 export { InputMode } from "./components/dropi-input/dropi-input";
 export { ModalPosition, ModalSize } from "./components/dropi-modal/dropi-modal";
 export { Event } from "./stencil-public-runtime";
+export { RadioOption } from "./components/dropi-radio-selection-list/dropi-radio-selection-list";
+export { SearchOption } from "./components/dropi-search/dropi-search";
 export { SelectOption, SelectOptionGroup } from "./components/dropi-select/select.types";
+export { FlowMode, StepperType } from "./components/dropi-simple-stepper/dropi-simple-stepper";
 export { SkeletonVariant } from "./components/dropi-skeleton/dropi-skeleton";
+export { StepLabel } from "./components/dropi-steps/dropi-steps";
 export { TabItem } from "./components/dropi-tabs/dropi-tabs";
 export { TagState, TagType } from "./components/dropi-tag/dropi-tag";
 export { ResizeMode } from "./components/dropi-text-area/dropi-text-area";
+export { TimelineStep } from "./components/dropi-time-line/dropi-time-line";
 export { ToastMessage } from "./components/dropi-toast/dropi-toast";
 export { TooltipPosition } from "./components/dropi-tooltip/dropi-tooltip";
+export { VerticalStep } from "./components/dropi-vertical-steps/dropi-vertical-steps";
 export namespace Components {
     /**
      * @component dropi-accordion
@@ -59,6 +81,84 @@ export namespace Components {
          */
         "preIcon": string;
     }
+    /**
+     * @component dropi-alert
+     * Alert banner with state variants (success/error/warning/info),
+     * optional action button, anchor link, and dismissable close icon.
+     */
+    interface DropiAlert {
+        /**
+          * Anchor/link label
+          * @default ''
+         */
+        "anchorText": string;
+        /**
+          * Anchor href
+          * @default ''
+         */
+        "anchorUrl": string;
+        /**
+          * Action button label
+          * @default ''
+         */
+        "buttonText": string;
+        /**
+          * Show the × close button
+          * @default false
+         */
+        "dismissable": boolean;
+        /**
+          * Alert message text (supports plain text)
+          * @default ''
+         */
+        "message": string;
+        /**
+          * Whether the alert is visible
+          * @default true
+         */
+        "showAlert": boolean;
+        /**
+          * Show action button
+          * @default false
+         */
+        "showButton": boolean;
+        /**
+          * Semantic state
+          * @default 'info'
+         */
+        "state": AlertState;
+        /**
+          * Layout type: default (inline) | flag (accented left border)
+          * @default 'default'
+         */
+        "type": AlertType;
+    }
+    /**
+     * @component dropi-avatars
+     * Avatar component with image, initials fallback, and type-based size variants.
+     */
+    interface DropiAvatars {
+        /**
+          * Alt text for the image
+          * @default 'avatar'
+         */
+        "alt": string;
+        /**
+          * Image URL
+          * @default ''
+         */
+        "image": string;
+        /**
+          * Initials to show when no image (max 2 chars)
+          * @default ''
+         */
+        "initials": string;
+        /**
+          * Size/context variant
+          * @default 'users'
+         */
+        "type": AvatarType;
+    }
     /**
      * @component dropi-badge
      * Status badge for user/account states.
@@ -112,6 +212,37 @@ export namespace Components {
          */
         "type": ButtonType;
     }
+    /**
+     * @component dropi-card-section
+     * Section card with title, description and a switch or dropdown control.
+     */
+    interface DropiCardSection {
+        /**
+          * Section description
+          * @default ''
+         */
+        "description": string;
+        /**
+          * Switch checked state
+          * @default false
+         */
+        "isChecked": boolean;
+        /**
+          * Section title
+          * @default ''
+         */
+        "sectionTitle": string;
+        /**
+          * Title size variant
+          * @default 'medium'
+         */
+        "type": 'medium' | 'important';
+        /**
+          * Control type on the right
+          * @default 'switch'
+         */
+        "typeElement": 'dropdown' | 'switch';
+    }
     /**
      * @component dropi-checkbox
      * A styled checkbox that emits change events.
@@ -129,6 +260,101 @@ export namespace Components {
          */
         "disabled": boolean;
     }
+    /**
+     * @component dropi-checkbox-selection-list
+     * Searchable list of checkbox options with multi-select support.
+     */
+    interface DropiCheckboxSelectionList {
+        /**
+          * Search placeholder
+          * @default 'Buscar...'
+         */
+        "filterPlaceholder": string;
+        /**
+          * Allow multiple selection
+          * @default true
+         */
+        "multiSelect": boolean;
+        /**
+          * Empty state message
+          * @default 'Sin resultados'
+         */
+        "notFoundMessage": string;
+        /**
+          * Options array or JSON string
+          * @default []
+         */
+        "options": CheckboxOption[] | string;
+        /**
+          * Show search filter
+          * @default true
+         */
+        "showFilter": boolean;
+        /**
+          * Show "no results" message
+          * @default true
+         */
+        "showNotFound": boolean;
+    }
+    /**
+     * @component dropi-chips
+     * Chip/tag-like element with optional icon, avatar, and close button.
+     * Use <slot> for the chip label text.
+     */
+    interface DropiChips {
+        /**
+          * Visual style
+          * @default 'filters'
+         */
+        "chipStyle": ChipStyle;
+        /**
+          * Icon name (when type = 'icon')
+          * @default ''
+         */
+        "icon": string;
+        /**
+          * Show the close/remove icon
+          * @default true
+         */
+        "showIcon": boolean;
+        /**
+          * Content type
+          * @default 'text'
+         */
+        "type": ChipType;
+        /**
+          * Avatar image URL (when type = 'avatar')
+          * @default ''
+         */
+        "urlImg": string;
+    }
+    /**
+     * @component dropi-dropdown
+     * Scrollable list with checkboxes for multi-selection.
+     * Pass options as an array (JS) or JSON string.
+     */
+    interface DropiDropdown {
+        /**
+          * Max height of the list container (CSS value)
+          * @default '300px'
+         */
+        "height": string;
+        /**
+          * Property name to use as the option image/avatar URL
+          * @default ''
+         */
+        "imageModel": string;
+        /**
+          * Options array or JSON string
+          * @default []
+         */
+        "options": DropdownOption[] | string;
+        /**
+          * Property name to display as the option label
+          * @default 'name'
+         */
+        "valueModel": string;
+    }
     /**
      * @component dropi-empty-state
      * Empty state illustration with title, description and optional action button.
@@ -165,6 +391,17 @@ export namespace Components {
          */
         "secondaryLabel": string;
     }
+    /**
+     * @component dropi-favorite-button
+     * Heart toggle button for marking items as favorite.
+     */
+    interface DropiFavoriteButton {
+        /**
+          * Whether the item is currently marked as favorite
+          * @default false
+         */
+        "isFavorite": boolean;
+    }
     /**
      * @component dropi-icon
      * Renders an SVG icon from the Dropi sprite sheet.
@@ -192,6 +429,53 @@ export namespace Components {
          */
         "width": string;
     }
+    /**
+     * @component dropi-image-miniature
+     * Grid of image thumbnails with zoom-on-hover overlay trigger.
+     */
+    interface DropiImageMiniature {
+        /**
+          * Thumbnail height (CSS value)
+          * @default '88px'
+         */
+        "height": string;
+        /**
+          * Array of image URLs. Pass as JSON string or array
+          * @default []
+         */
+        "images": string[] | string;
+        /**
+          * Optional label above the grid
+          * @default ''
+         */
+        "label": string;
+        /**
+          * Thumbnail width (CSS value)
+          * @default '88px'
+         */
+        "width": string;
+    }
+    /**
+     * @component dropi-image-overlay
+     * Full-screen image lightbox with prev/next navigation and thumbnails.
+     */
+    interface DropiImageOverlay {
+        /**
+          * Initially active image index
+          * @default 0
+         */
+        "activeIndex": number;
+        /**
+          * Images array or JSON string
+          * @default []
+         */
+        "images": string[] | string;
+        /**
+          * Whether the overlay is visible
+          * @default false
+         */
+        "visible": boolean;
+    }
     /**
      * @component dropi-input
      * Text input with floating label, validation states, password toggle,
@@ -316,6 +600,53 @@ export namespace Components {
          */
         "value": string;
     }
+    /**
+     * @component dropi-logo
+     * Displays the Dropi brand logo with size variants.
+     */
+    interface DropiLogo {
+        /**
+          * Size variant
+          * @default 'large'
+         */
+        "size": 'small' | 'large';
+        /**
+          * Theme (reserved for future use)
+          * @default 'light'
+         */
+        "theme": 'dark' | 'light';
+        /**
+          * Logo image URL
+          * @default ''
+         */
+        "urlLogo": string;
+    }
+    /**
+     * @component dropi-lottie-loader
+     * Full-screen or inline loading overlay with a Lottie animation.
+     */
+    interface DropiLottieLoader {
+        /**
+          * Title shown below the animation
+          * @default ''
+         */
+        "loaderTitle": string;
+        /**
+          * Path to the Lottie JSON animation file
+          * @default ''
+         */
+        "loadingAnimation": string;
+        /**
+          * Descriptive message below the title
+          * @default ''
+         */
+        "message": string;
+        /**
+          * Show or hide the loader
+          * @default false
+         */
+        "visible": boolean;
+    }
     /**
      * @component dropi-modal
      * Modal/dialog with backdrop, close button, and header/content/footer slots.
@@ -361,6 +692,32 @@ export namespace Components {
          */
         "visible": boolean;
     }
+    /**
+     * @component dropi-otp-send-code
+     * 6-digit OTP input with countdown timer and resend capability.
+     */
+    interface DropiOtpSendCode {
+        /**
+          * Delivery method label
+          * @default 'email'
+         */
+        "engine": 'email' | 'sms' | '2fa';
+        /**
+          * Error message to display
+          * @default ''
+         */
+        "errorMessage": string;
+        /**
+          * Contact info (email/phone to show in label)
+          * @default ''
+         */
+        "labelContact": string;
+        /**
+          * Show contact label
+          * @default true
+         */
+        "showLabelContact": boolean;
+    }
     /**
      * @component dropi-paginator
      * Pagination control with page numbers, prev/next buttons and items-per-page selector.
@@ -371,6 +728,11 @@ export namespace Components {
           * @default 5
          */
         "maxPages": number;
+        /**
+          * Hide "Anterior"/"Siguiente" text labels, show only arrows
+          * @default false
+         */
+        "noLabels": boolean;
         /**
           * Current page (1-based)
           * @default 1
@@ -428,6 +790,109 @@ export namespace Components {
          */
         "resetTrigger": boolean;
     }
+    /**
+     * @component dropi-radio-selection-list
+     * List of radio button options with optional search filter.
+     */
+    interface DropiRadioSelectionList {
+        /**
+          * Search placeholder
+          * @default 'Buscar...'
+         */
+        "filterPlaceholder": string;
+        /**
+          * Options array or JSON string
+          * @default []
+         */
+        "options": RadioOption[] | string;
+        /**
+          * Selected option id
+          * @default ''
+         */
+        "selectedOption": string | number;
+        /**
+          * Show search box
+          * @default false
+         */
+        "showFilter": boolean;
+        /**
+          * Show description below name
+          * @default 'default'
+         */
+        "typeLayout": 'description' | 'default';
+    }
+    /**
+     * @component dropi-read-more
+     * Truncates text to a word limit with an expandable "Ver más / Ver menos" toggle.
+     */
+    interface DropiReadMore {
+        /**
+          * Maximum number of words before truncating
+          * @default 20
+         */
+        "maxWords": number;
+        /**
+          * Allow collapsing back after expanding
+          * @default true
+         */
+        "showSeeLess": boolean;
+        /**
+          * Full text to display
+          * @default ''
+         */
+        "text": string;
+    }
+    /**
+     * @component dropi-search
+     * Text search input with optional dropdown results list.
+     * Supports single and multi-select, keyboard navigation, and clear button.
+     */
+    interface DropiSearch {
+        /**
+          * Max height of dropdown (CSS value)
+          * @default '240px'
+         */
+        "dropdownHeight": string;
+        /**
+          * Label shown above the input
+          * @default ''
+         */
+        "label": string;
+        /**
+          * Property name to display and search
+          * @default 'name'
+         */
+        "labelKey": string;
+        /**
+          * Max character length
+         */
+        "maxlength": number;
+        /**
+          * Allow multiple selection
+          * @default false
+         */
+        "multiSelect": boolean;
+        /**
+          * Data source to filter. Pass as array or JSON string
+          * @default []
+         */
+        "options": SearchOption[] | string;
+        /**
+          * Placeholder text
+          * @default 'Buscar...'
+         */
+        "placeholder": string;
+        /**
+          * Show clear (×) button when input has text
+          * @default true
+         */
+        "showClear": boolean;
+        /**
+          * Controlled input value
+          * @default ''
+         */
+        "value": string;
+    }
     /**
      * @component dropi-select
      * Feature-rich select with support for:
@@ -547,6 +1012,37 @@ export namespace Components {
          */
         "value": SelectOption | null;
     }
+    /**
+     * @component dropi-simple-stepper
+     * Compact horizontal stepper using dots or numbers.
+     */
+    interface DropiSimpleStepper {
+        /**
+          * Current active step (1-based)
+          * @default 1
+         */
+        "currentStep": number;
+        /**
+          * Flow mode (visual only)
+          * @default 'Sequential'
+         */
+        "flowMode": FlowMode;
+        /**
+          * Labels shown below each step. Pass as JSON string or array
+          * @default []
+         */
+        "labelStepper": string[] | string;
+        /**
+          * Total steps
+          * @default 3
+         */
+        "stepsCount": number;
+        /**
+          * Circle content: 'point' (dot) | 'number'
+          * @default 'number'
+         */
+        "typeStep": StepperType;
+    }
     /**
      * @component dropi-skeleton
      * Loading placeholder with shimmer animation.
@@ -578,6 +1074,32 @@ export namespace Components {
          */
         "width": string;
     }
+    /**
+     * @component dropi-steps
+     * Horizontal stepper showing step progress with number/title/description.
+     */
+    interface DropiSteps {
+        /**
+          * Active/current step index (1-based)
+          * @default 1
+         */
+        "currentStep": number;
+        /**
+          * Show step number inside the circle
+          * @default true
+         */
+        "showNumberOfStep": boolean;
+        /**
+          * Labels for each step. Pass as JSON string or array
+          * @default []
+         */
+        "stepLabels": StepLabel[] | string;
+        /**
+          * Total number of steps
+          * @default 3
+         */
+        "stepsCount": number;
+    }
     /**
      * @component dropi-switch
      * Toggle switch component. Emits dropiChange on toggle.
@@ -726,6 +1248,17 @@ export namespace Components {
          */
         "value": string;
     }
+    /**
+     * @component dropi-time-line
+     * Vertical timeline showing ordered steps with status indicators.
+     */
+    interface DropiTimeLine {
+        /**
+          * Array of timeline steps. Pass as JSON string or array
+          * @default []
+         */
+        "steps": TimelineStep[] | string;
+    }
     /**
      * @component dropi-toast
      * Global toast notification stack. Place once in the app root, call show() from JS.
@@ -781,23 +1314,81 @@ export namespace Components {
          */
         "text": string;
     }
+    /**
+     * @component dropi-vertical-steps
+     * Vertical step-by-step progress indicator with optional click navigation.
+     */
+    interface DropiVerticalSteps {
+        /**
+          * Allow clicking completed steps to navigate back
+          * @default false
+         */
+        "clickable": boolean;
+        /**
+          * Currently active step (1-based)
+          * @default 1
+         */
+        "currentStep": number;
+        /**
+          * Show check icon inside completed step circles
+          * @default true
+         */
+        "showCheckIcon": boolean;
+        /**
+          * Array of steps. Pass as JSON string or array
+          * @default []
+         */
+        "steps": VerticalStep[] | string;
+    }
 }
 export interface DropiAccordionCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDropiAccordionElement;
 }
+export interface DropiAlertCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDropiAlertElement;
+}
 export interface DropiButtonCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDropiButtonElement;
 }
+export interface DropiCardSectionCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDropiCardSectionElement;
+}
 export interface DropiCheckboxCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDropiCheckboxElement;
 }
+export interface DropiCheckboxSelectionListCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDropiCheckboxSelectionListElement;
+}
+export interface DropiChipsCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDropiChipsElement;
+}
+export interface DropiDropdownCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDropiDropdownElement;
+}
 export interface DropiEmptyStateCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDropiEmptyStateElement;
 }
+export interface DropiFavoriteButtonCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDropiFavoriteButtonElement;
+}
+export interface DropiImageMiniatureCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDropiImageMiniatureElement;
+}
+export interface DropiImageOverlayCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDropiImageOverlayElement;
+}
 export interface DropiInputCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDropiInputElement;
@@ -806,6 +1397,10 @@ export interface DropiModalCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDropiModalElement;
 }
+export interface DropiOtpSendCodeCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDropiOtpSendCodeElement;
+}
 export interface DropiPaginatorCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDropiPaginatorElement;
@@ -814,6 +1409,14 @@ export interface DropiRadioButtonCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDropiRadioButtonElement;
 }
+export interface DropiRadioSelectionListCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDropiRadioSelectionListElement;
+}
+export interface DropiSearchCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDropiSearchElement;
+}
 export interface DropiSelectCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDropiSelectElement;
@@ -830,6 +1433,10 @@ export interface DropiTextAreaCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLDropiTextAreaElement;
 }
+export interface DropiVerticalStepsCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDropiVerticalStepsElement;
+}
 declare global {
     interface HTMLDropiAccordionElementEventMap {
         "dropiToggle": boolean;
@@ -855,6 +1462,40 @@ declare global {
         prototype: HTMLDropiAccordionElement;
         new (): HTMLDropiAccordionElement;
     };
+    interface HTMLDropiAlertElementEventMap {
+        "dropiClose": void;
+        "dropiButtonClick": void;
+        "dropiLinkClick": void;
+    }
+    /**
+     * @component dropi-alert
+     * Alert banner with state variants (success/error/warning/info),
+     * optional action button, anchor link, and dismissable close icon.
+     */
+    interface HTMLDropiAlertElement extends Components.DropiAlert, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDropiAlertElementEventMap>(type: K, listener: (this: HTMLDropiAlertElement, ev: DropiAlertCustomEvent<HTMLDropiAlertElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDropiAlertElementEventMap>(type: K, listener: (this: HTMLDropiAlertElement, ev: DropiAlertCustomEvent<HTMLDropiAlertElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDropiAlertElement: {
+        prototype: HTMLDropiAlertElement;
+        new (): HTMLDropiAlertElement;
+    };
+    /**
+     * @component dropi-avatars
+     * Avatar component with image, initials fallback, and type-based size variants.
+     */
+    interface HTMLDropiAvatarsElement extends Components.DropiAvatars, HTMLStencilElement {
+    }
+    var HTMLDropiAvatarsElement: {
+        prototype: HTMLDropiAvatarsElement;
+        new (): HTMLDropiAvatarsElement;
+    };
     /**
      * @component dropi-badge
      * Status badge for user/account states.
@@ -887,6 +1528,28 @@ declare global {
         prototype: HTMLDropiButtonElement;
         new (): HTMLDropiButtonElement;
     };
+    interface HTMLDropiCardSectionElementEventMap {
+        "dropiChange": boolean;
+        "dropiClick": void;
+    }
+    /**
+     * @component dropi-card-section
+     * Section card with title, description and a switch or dropdown control.
+     */
+    interface HTMLDropiCardSectionElement extends Components.DropiCardSection, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDropiCardSectionElementEventMap>(type: K, listener: (this: HTMLDropiCardSectionElement, ev: DropiCardSectionCustomEvent<HTMLDropiCardSectionElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDropiCardSectionElementEventMap>(type: K, listener: (this: HTMLDropiCardSectionElement, ev: DropiCardSectionCustomEvent<HTMLDropiCardSectionElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDropiCardSectionElement: {
+        prototype: HTMLDropiCardSectionElement;
+        new (): HTMLDropiCardSectionElement;
+    };
     interface HTMLDropiCheckboxElementEventMap {
         "dropiChange": boolean;
     }
@@ -909,6 +1572,72 @@ declare global {
         prototype: HTMLDropiCheckboxElement;
         new (): HTMLDropiCheckboxElement;
     };
+    interface HTMLDropiCheckboxSelectionListElementEventMap {
+        "dropiCheckedValues": (string | number)[];
+        "dropiSearch": string;
+    }
+    /**
+     * @component dropi-checkbox-selection-list
+     * Searchable list of checkbox options with multi-select support.
+     */
+    interface HTMLDropiCheckboxSelectionListElement extends Components.DropiCheckboxSelectionList, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDropiCheckboxSelectionListElementEventMap>(type: K, listener: (this: HTMLDropiCheckboxSelectionListElement, ev: DropiCheckboxSelectionListCustomEvent<HTMLDropiCheckboxSelectionListElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDropiCheckboxSelectionListElementEventMap>(type: K, listener: (this: HTMLDropiCheckboxSelectionListElement, ev: DropiCheckboxSelectionListCustomEvent<HTMLDropiCheckboxSelectionListElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDropiCheckboxSelectionListElement: {
+        prototype: HTMLDropiCheckboxSelectionListElement;
+        new (): HTMLDropiCheckboxSelectionListElement;
+    };
+    interface HTMLDropiChipsElementEventMap {
+        "dropiClose": void;
+    }
+    /**
+     * @component dropi-chips
+     * Chip/tag-like element with optional icon, avatar, and close button.
+     * Use <slot> for the chip label text.
+     */
+    interface HTMLDropiChipsElement extends Components.DropiChips, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDropiChipsElementEventMap>(type: K, listener: (this: HTMLDropiChipsElement, ev: DropiChipsCustomEvent<HTMLDropiChipsElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDropiChipsElementEventMap>(type: K, listener: (this: HTMLDropiChipsElement, ev: DropiChipsCustomEvent<HTMLDropiChipsElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDropiChipsElement: {
+        prototype: HTMLDropiChipsElement;
+        new (): HTMLDropiChipsElement;
+    };
+    interface HTMLDropiDropdownElementEventMap {
+        "dropiChange": DropdownOption[];
+    }
+    /**
+     * @component dropi-dropdown
+     * Scrollable list with checkboxes for multi-selection.
+     * Pass options as an array (JS) or JSON string.
+     */
+    interface HTMLDropiDropdownElement extends Components.DropiDropdown, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDropiDropdownElementEventMap>(type: K, listener: (this: HTMLDropiDropdownElement, ev: DropiDropdownCustomEvent<HTMLDropiDropdownElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDropiDropdownElementEventMap>(type: K, listener: (this: HTMLDropiDropdownElement, ev: DropiDropdownCustomEvent<HTMLDropiDropdownElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDropiDropdownElement: {
+        prototype: HTMLDropiDropdownElement;
+        new (): HTMLDropiDropdownElement;
+    };
     interface HTMLDropiEmptyStateElementEventMap {
         "dropiAction": void;
         "dropiSecondaryAction": void;
@@ -931,6 +1660,27 @@ declare global {
         prototype: HTMLDropiEmptyStateElement;
         new (): HTMLDropiEmptyStateElement;
     };
+    interface HTMLDropiFavoriteButtonElementEventMap {
+        "dropiToggleFavorite": boolean;
+    }
+    /**
+     * @component dropi-favorite-button
+     * Heart toggle button for marking items as favorite.
+     */
+    interface HTMLDropiFavoriteButtonElement extends Components.DropiFavoriteButton, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDropiFavoriteButtonElementEventMap>(type: K, listener: (this: HTMLDropiFavoriteButtonElement, ev: DropiFavoriteButtonCustomEvent<HTMLDropiFavoriteButtonElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDropiFavoriteButtonElementEventMap>(type: K, listener: (this: HTMLDropiFavoriteButtonElement, ev: DropiFavoriteButtonCustomEvent<HTMLDropiFavoriteButtonElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDropiFavoriteButtonElement: {
+        prototype: HTMLDropiFavoriteButtonElement;
+        new (): HTMLDropiFavoriteButtonElement;
+    };
     /**
      * @component dropi-icon
      * Renders an SVG icon from the Dropi sprite sheet.
@@ -942,6 +1692,48 @@ declare global {
         prototype: HTMLDropiIconElement;
         new (): HTMLDropiIconElement;
     };
+    interface HTMLDropiImageMiniatureElementEventMap {
+        "dropiImageClick": { images: string[]; index: number };
+    }
+    /**
+     * @component dropi-image-miniature
+     * Grid of image thumbnails with zoom-on-hover overlay trigger.
+     */
+    interface HTMLDropiImageMiniatureElement extends Components.DropiImageMiniature, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDropiImageMiniatureElementEventMap>(type: K, listener: (this: HTMLDropiImageMiniatureElement, ev: DropiImageMiniatureCustomEvent<HTMLDropiImageMiniatureElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDropiImageMiniatureElementEventMap>(type: K, listener: (this: HTMLDropiImageMiniatureElement, ev: DropiImageMiniatureCustomEvent<HTMLDropiImageMiniatureElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDropiImageMiniatureElement: {
+        prototype: HTMLDropiImageMiniatureElement;
+        new (): HTMLDropiImageMiniatureElement;
+    };
+    interface HTMLDropiImageOverlayElementEventMap {
+        "dropiClose": void;
+    }
+    /**
+     * @component dropi-image-overlay
+     * Full-screen image lightbox with prev/next navigation and thumbnails.
+     */
+    interface HTMLDropiImageOverlayElement extends Components.DropiImageOverlay, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDropiImageOverlayElementEventMap>(type: K, listener: (this: HTMLDropiImageOverlayElement, ev: DropiImageOverlayCustomEvent<HTMLDropiImageOverlayElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDropiImageOverlayElementEventMap>(type: K, listener: (this: HTMLDropiImageOverlayElement, ev: DropiImageOverlayCustomEvent<HTMLDropiImageOverlayElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDropiImageOverlayElement: {
+        prototype: HTMLDropiImageOverlayElement;
+        new (): HTMLDropiImageOverlayElement;
+    };
     interface HTMLDropiInputElementEventMap {
         "dropiInput": string;
         "dropiChange": string;
@@ -975,6 +1767,26 @@ declare global {
         prototype: HTMLDropiInputElement;
         new (): HTMLDropiInputElement;
     };
+    /**
+     * @component dropi-logo
+     * Displays the Dropi brand logo with size variants.
+     */
+    interface HTMLDropiLogoElement extends Components.DropiLogo, HTMLStencilElement {
+    }
+    var HTMLDropiLogoElement: {
+        prototype: HTMLDropiLogoElement;
+        new (): HTMLDropiLogoElement;
+    };
+    /**
+     * @component dropi-lottie-loader
+     * Full-screen or inline loading overlay with a Lottie animation.
+     */
+    interface HTMLDropiLottieLoaderElement extends Components.DropiLottieLoader, HTMLStencilElement {
+    }
+    var HTMLDropiLottieLoaderElement: {
+        prototype: HTMLDropiLottieLoaderElement;
+        new (): HTMLDropiLottieLoaderElement;
+    };
     interface HTMLDropiModalElementEventMap {
         "dropiShow": void;
         "dropiHide": void;
@@ -999,6 +1811,28 @@ declare global {
         prototype: HTMLDropiModalElement;
         new (): HTMLDropiModalElement;
     };
+    interface HTMLDropiOtpSendCodeElementEventMap {
+        "dropiCodeCompleted": string;
+        "dropiResend": void;
+    }
+    /**
+     * @component dropi-otp-send-code
+     * 6-digit OTP input with countdown timer and resend capability.
+     */
+    interface HTMLDropiOtpSendCodeElement extends Components.DropiOtpSendCode, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDropiOtpSendCodeElementEventMap>(type: K, listener: (this: HTMLDropiOtpSendCodeElement, ev: DropiOtpSendCodeCustomEvent<HTMLDropiOtpSendCodeElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDropiOtpSendCodeElementEventMap>(type: K, listener: (this: HTMLDropiOtpSendCodeElement, ev: DropiOtpSendCodeCustomEvent<HTMLDropiOtpSendCodeElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDropiOtpSendCodeElement: {
+        prototype: HTMLDropiOtpSendCodeElement;
+        new (): HTMLDropiOtpSendCodeElement;
+    };
     interface HTMLDropiPaginatorElementEventMap {
         "dropiPageChange": { page: number; pageSize: number };
     }
@@ -1041,6 +1875,64 @@ declare global {
         prototype: HTMLDropiRadioButtonElement;
         new (): HTMLDropiRadioButtonElement;
     };
+    interface HTMLDropiRadioSelectionListElementEventMap {
+        "dropiChange": string | number;
+        "dropiSearch": string;
+    }
+    /**
+     * @component dropi-radio-selection-list
+     * List of radio button options with optional search filter.
+     */
+    interface HTMLDropiRadioSelectionListElement extends Components.DropiRadioSelectionList, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDropiRadioSelectionListElementEventMap>(type: K, listener: (this: HTMLDropiRadioSelectionListElement, ev: DropiRadioSelectionListCustomEvent<HTMLDropiRadioSelectionListElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDropiRadioSelectionListElementEventMap>(type: K, listener: (this: HTMLDropiRadioSelectionListElement, ev: DropiRadioSelectionListCustomEvent<HTMLDropiRadioSelectionListElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDropiRadioSelectionListElement: {
+        prototype: HTMLDropiRadioSelectionListElement;
+        new (): HTMLDropiRadioSelectionListElement;
+    };
+    /**
+     * @component dropi-read-more
+     * Truncates text to a word limit with an expandable "Ver más / Ver menos" toggle.
+     */
+    interface HTMLDropiReadMoreElement extends Components.DropiReadMore, HTMLStencilElement {
+    }
+    var HTMLDropiReadMoreElement: {
+        prototype: HTMLDropiReadMoreElement;
+        new (): HTMLDropiReadMoreElement;
+    };
+    interface HTMLDropiSearchElementEventMap {
+        "dropiInput": string;
+        "dropiBlur": void;
+        "dropiKeyEnter": string;
+        "dropiClear": void;
+        "dropiChange": SearchOption[];
+    }
+    /**
+     * @component dropi-search
+     * Text search input with optional dropdown results list.
+     * Supports single and multi-select, keyboard navigation, and clear button.
+     */
+    interface HTMLDropiSearchElement extends Components.DropiSearch, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDropiSearchElementEventMap>(type: K, listener: (this: HTMLDropiSearchElement, ev: DropiSearchCustomEvent<HTMLDropiSearchElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDropiSearchElementEventMap>(type: K, listener: (this: HTMLDropiSearchElement, ev: DropiSearchCustomEvent<HTMLDropiSearchElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDropiSearchElement: {
+        prototype: HTMLDropiSearchElement;
+        new (): HTMLDropiSearchElement;
+    };
     interface HTMLDropiSelectElementEventMap {
         "dropiChange": SelectOption | SelectOption[];
         "dropiClear": void;
@@ -1081,6 +1973,16 @@ declare global {
         prototype: HTMLDropiSelectElement;
         new (): HTMLDropiSelectElement;
     };
+    /**
+     * @component dropi-simple-stepper
+     * Compact horizontal stepper using dots or numbers.
+     */
+    interface HTMLDropiSimpleStepperElement extends Components.DropiSimpleStepper, HTMLStencilElement {
+    }
+    var HTMLDropiSimpleStepperElement: {
+        prototype: HTMLDropiSimpleStepperElement;
+        new (): HTMLDropiSimpleStepperElement;
+    };
     /**
      * @component dropi-skeleton
      * Loading placeholder with shimmer animation.
@@ -1091,6 +1993,16 @@ declare global {
         prototype: HTMLDropiSkeletonElement;
         new (): HTMLDropiSkeletonElement;
     };
+    /**
+     * @component dropi-steps
+     * Horizontal stepper showing step progress with number/title/description.
+     */
+    interface HTMLDropiStepsElement extends Components.DropiSteps, HTMLStencilElement {
+    }
+    var HTMLDropiStepsElement: {
+        prototype: HTMLDropiStepsElement;
+        new (): HTMLDropiStepsElement;
+    };
     interface HTMLDropiSwitchElementEventMap {
         "dropiChange": boolean;
     }
@@ -1172,6 +2084,16 @@ declare global {
         prototype: HTMLDropiTextAreaElement;
         new (): HTMLDropiTextAreaElement;
     };
+    /**
+     * @component dropi-time-line
+     * Vertical timeline showing ordered steps with status indicators.
+     */
+    interface HTMLDropiTimeLineElement extends Components.DropiTimeLine, HTMLStencilElement {
+    }
+    var HTMLDropiTimeLineElement: {
+        prototype: HTMLDropiTimeLineElement;
+        new (): HTMLDropiTimeLineElement;
+    };
     /**
      * @component dropi-toast
      * Global toast notification stack. Place once in the app root, call show() from JS.
@@ -1197,25 +2119,65 @@ declare global {
         prototype: HTMLDropiTooltipElement;
         new (): HTMLDropiTooltipElement;
     };
+    interface HTMLDropiVerticalStepsElementEventMap {
+        "dropiStepClick": number;
+    }
+    /**
+     * @component dropi-vertical-steps
+     * Vertical step-by-step progress indicator with optional click navigation.
+     */
+    interface HTMLDropiVerticalStepsElement extends Components.DropiVerticalSteps, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDropiVerticalStepsElementEventMap>(type: K, listener: (this: HTMLDropiVerticalStepsElement, ev: DropiVerticalStepsCustomEvent<HTMLDropiVerticalStepsElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDropiVerticalStepsElementEventMap>(type: K, listener: (this: HTMLDropiVerticalStepsElement, ev: DropiVerticalStepsCustomEvent<HTMLDropiVerticalStepsElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDropiVerticalStepsElement: {
+        prototype: HTMLDropiVerticalStepsElement;
+        new (): HTMLDropiVerticalStepsElement;
+    };
     interface HTMLElementTagNameMap {
         "dropi-accordion": HTMLDropiAccordionElement;
+        "dropi-alert": HTMLDropiAlertElement;
+        "dropi-avatars": HTMLDropiAvatarsElement;
         "dropi-badge": HTMLDropiBadgeElement;
         "dropi-button": HTMLDropiButtonElement;
+        "dropi-card-section": HTMLDropiCardSectionElement;
         "dropi-checkbox": HTMLDropiCheckboxElement;
+        "dropi-checkbox-selection-list": HTMLDropiCheckboxSelectionListElement;
+        "dropi-chips": HTMLDropiChipsElement;
+        "dropi-dropdown": HTMLDropiDropdownElement;
         "dropi-empty-state": HTMLDropiEmptyStateElement;
+        "dropi-favorite-button": HTMLDropiFavoriteButtonElement;
         "dropi-icon": HTMLDropiIconElement;
+        "dropi-image-miniature": HTMLDropiImageMiniatureElement;
+        "dropi-image-overlay": HTMLDropiImageOverlayElement;
         "dropi-input": HTMLDropiInputElement;
+        "dropi-logo": HTMLDropiLogoElement;
+        "dropi-lottie-loader": HTMLDropiLottieLoaderElement;
         "dropi-modal": HTMLDropiModalElement;
+        "dropi-otp-send-code": HTMLDropiOtpSendCodeElement;
         "dropi-paginator": HTMLDropiPaginatorElement;
         "dropi-radio-button": HTMLDropiRadioButtonElement;
+        "dropi-radio-selection-list": HTMLDropiRadioSelectionListElement;
+        "dropi-read-more": HTMLDropiReadMoreElement;
+        "dropi-search": HTMLDropiSearchElement;
         "dropi-select": HTMLDropiSelectElement;
+        "dropi-simple-stepper": HTMLDropiSimpleStepperElement;
         "dropi-skeleton": HTMLDropiSkeletonElement;
+        "dropi-steps": HTMLDropiStepsElement;
         "dropi-switch": HTMLDropiSwitchElement;
         "dropi-tabs": HTMLDropiTabsElement;
         "dropi-tag": HTMLDropiTagElement;
         "dropi-text-area": HTMLDropiTextAreaElement;
+        "dropi-time-line": HTMLDropiTimeLineElement;
         "dropi-toast": HTMLDropiToastElement;
         "dropi-tooltip": HTMLDropiTooltipElement;
+        "dropi-vertical-steps": HTMLDropiVerticalStepsElement;
     }
 }
 declare namespace LocalJSX {
@@ -1252,6 +2214,96 @@ declare namespace LocalJSX {
          */
         "preIcon"?: string;
     }
+    /**
+     * @component dropi-alert
+     * Alert banner with state variants (success/error/warning/info),
+     * optional action button, anchor link, and dismissable close icon.
+     */
+    interface DropiAlert {
+        /**
+          * Anchor/link label
+          * @default ''
+         */
+        "anchorText"?: string;
+        /**
+          * Anchor href
+          * @default ''
+         */
+        "anchorUrl"?: string;
+        /**
+          * Action button label
+          * @default ''
+         */
+        "buttonText"?: string;
+        /**
+          * Show the × close button
+          * @default false
+         */
+        "dismissable"?: boolean;
+        /**
+          * Alert message text (supports plain text)
+          * @default ''
+         */
+        "message"?: string;
+        /**
+          * Emitted when the action button is clicked
+         */
+        "onDropiButtonClick"?: (event: DropiAlertCustomEvent<void>) => void;
+        /**
+          * Emitted when the alert is dismissed
+         */
+        "onDropiClose"?: (event: DropiAlertCustomEvent<void>) => void;
+        /**
+          * Emitted when the anchor link is clicked
+         */
+        "onDropiLinkClick"?: (event: DropiAlertCustomEvent<void>) => void;
+        /**
+          * Whether the alert is visible
+          * @default true
+         */
+        "showAlert"?: boolean;
+        /**
+          * Show action button
+          * @default false
+         */
+        "showButton"?: boolean;
+        /**
+          * Semantic state
+          * @default 'info'
+         */
+        "state"?: AlertState;
+        /**
+          * Layout type: default (inline) | flag (accented left border)
+          * @default 'default'
+         */
+        "type"?: AlertType;
+    }
+    /**
+     * @component dropi-avatars
+     * Avatar component with image, initials fallback, and type-based size variants.
+     */
+    interface DropiAvatars {
+        /**
+          * Alt text for the image
+          * @default 'avatar'
+         */
+        "alt"?: string;
+        /**
+          * Image URL
+          * @default ''
+         */
+        "image"?: string;
+        /**
+          * Initials to show when no image (max 2 chars)
+          * @default ''
+         */
+        "initials"?: string;
+        /**
+          * Size/context variant
+          * @default 'users'
+         */
+        "type"?: AvatarType;
+    }
     /**
      * @component dropi-badge
      * Status badge for user/account states.
@@ -1309,6 +2361,45 @@ declare namespace LocalJSX {
          */
         "type"?: ButtonType;
     }
+    /**
+     * @component dropi-card-section
+     * Section card with title, description and a switch or dropdown control.
+     */
+    interface DropiCardSection {
+        /**
+          * Section description
+          * @default ''
+         */
+        "description"?: string;
+        /**
+          * Switch checked state
+          * @default false
+         */
+        "isChecked"?: boolean;
+        /**
+          * Emitted when switch changes. e.detail = new boolean value
+         */
+        "onDropiChange"?: (event: DropiCardSectionCustomEvent<boolean>) => void;
+        /**
+          * Emitted when dropdown icon is clicked
+         */
+        "onDropiClick"?: (event: DropiCardSectionCustomEvent<void>) => void;
+        /**
+          * Section title
+          * @default ''
+         */
+        "sectionTitle"?: string;
+        /**
+          * Title size variant
+          * @default 'medium'
+         */
+        "type"?: 'medium' | 'important';
+        /**
+          * Control type on the right
+          * @default 'switch'
+         */
+        "typeElement"?: 'dropdown' | 'switch';
+    }
     /**
      * @component dropi-checkbox
      * A styled checkbox that emits change events.
@@ -1338,6 +2429,117 @@ declare namespace LocalJSX {
          */
         "onDropiChange"?: (event: DropiCheckboxCustomEvent<boolean>) => void;
     }
+    /**
+     * @component dropi-checkbox-selection-list
+     * Searchable list of checkbox options with multi-select support.
+     */
+    interface DropiCheckboxSelectionList {
+        /**
+          * Search placeholder
+          * @default 'Buscar...'
+         */
+        "filterPlaceholder"?: string;
+        /**
+          * Allow multiple selection
+          * @default true
+         */
+        "multiSelect"?: boolean;
+        /**
+          * Empty state message
+          * @default 'Sin resultados'
+         */
+        "notFoundMessage"?: string;
+        /**
+          * Emitted when selection changes. e.detail = selected option ids
+         */
+        "onDropiCheckedValues"?: (event: DropiCheckboxSelectionListCustomEvent<(string | number)[]>) => void;
+        /**
+          * Emitted on search input. e.detail = search text
+         */
+        "onDropiSearch"?: (event: DropiCheckboxSelectionListCustomEvent<string>) => void;
+        /**
+          * Options array or JSON string
+          * @default []
+         */
+        "options"?: CheckboxOption[] | string;
+        /**
+          * Show search filter
+          * @default true
+         */
+        "showFilter"?: boolean;
+        /**
+          * Show "no results" message
+          * @default true
+         */
+        "showNotFound"?: boolean;
+    }
+    /**
+     * @component dropi-chips
+     * Chip/tag-like element with optional icon, avatar, and close button.
+     * Use <slot> for the chip label text.
+     */
+    interface DropiChips {
+        /**
+          * Visual style
+          * @default 'filters'
+         */
+        "chipStyle"?: ChipStyle;
+        /**
+          * Icon name (when type = 'icon')
+          * @default ''
+         */
+        "icon"?: string;
+        /**
+          * Emitted when the close icon is clicked
+         */
+        "onDropiClose"?: (event: DropiChipsCustomEvent<void>) => void;
+        /**
+          * Show the close/remove icon
+          * @default true
+         */
+        "showIcon"?: boolean;
+        /**
+          * Content type
+          * @default 'text'
+         */
+        "type"?: ChipType;
+        /**
+          * Avatar image URL (when type = 'avatar')
+          * @default ''
+         */
+        "urlImg"?: string;
+    }
+    /**
+     * @component dropi-dropdown
+     * Scrollable list with checkboxes for multi-selection.
+     * Pass options as an array (JS) or JSON string.
+     */
+    interface DropiDropdown {
+        /**
+          * Max height of the list container (CSS value)
+          * @default '300px'
+         */
+        "height"?: string;
+        /**
+          * Property name to use as the option image/avatar URL
+          * @default ''
+         */
+        "imageModel"?: string;
+        /**
+          * Emitted when selection changes. e.detail = selected items array
+         */
+        "onDropiChange"?: (event: DropiDropdownCustomEvent<DropdownOption[]>) => void;
+        /**
+          * Options array or JSON string
+          * @default []
+         */
+        "options"?: DropdownOption[] | string;
+        /**
+          * Property name to display as the option label
+          * @default 'name'
+         */
+        "valueModel"?: string;
+    }
     /**
      * @component dropi-empty-state
      * Empty state illustration with title, description and optional action button.
@@ -1382,6 +2584,21 @@ declare namespace LocalJSX {
          */
         "secondaryLabel"?: string;
     }
+    /**
+     * @component dropi-favorite-button
+     * Heart toggle button for marking items as favorite.
+     */
+    interface DropiFavoriteButton {
+        /**
+          * Whether the item is currently marked as favorite
+          * @default false
+         */
+        "isFavorite"?: boolean;
+        /**
+          * Emitted when toggled. e.detail = new favorite state
+         */
+        "onDropiToggleFavorite"?: (event: DropiFavoriteButtonCustomEvent<boolean>) => void;
+    }
     /**
      * @component dropi-icon
      * Renders an SVG icon from the Dropi sprite sheet.
@@ -1404,10 +2621,65 @@ declare namespace LocalJSX {
          */
         "name"?: string;
         /**
-          * Width of the icon (CSS value)
-          * @default '24px'
+          * Width of the icon (CSS value)
+          * @default '24px'
+         */
+        "width"?: string;
+    }
+    /**
+     * @component dropi-image-miniature
+     * Grid of image thumbnails with zoom-on-hover overlay trigger.
+     */
+    interface DropiImageMiniature {
+        /**
+          * Thumbnail height (CSS value)
+          * @default '88px'
+         */
+        "height"?: string;
+        /**
+          * Array of image URLs. Pass as JSON string or array
+          * @default []
+         */
+        "images"?: string[] | string;
+        /**
+          * Optional label above the grid
+          * @default ''
+         */
+        "label"?: string;
+        /**
+          * Emitted when a thumbnail is clicked. e.detail = { images, index }
+         */
+        "onDropiImageClick"?: (event: DropiImageMiniatureCustomEvent<{ images: string[]; index: number }>) => void;
+        /**
+          * Thumbnail width (CSS value)
+          * @default '88px'
+         */
+        "width"?: string;
+    }
+    /**
+     * @component dropi-image-overlay
+     * Full-screen image lightbox with prev/next navigation and thumbnails.
+     */
+    interface DropiImageOverlay {
+        /**
+          * Initially active image index
+          * @default 0
+         */
+        "activeIndex"?: number;
+        /**
+          * Images array or JSON string
+          * @default []
+         */
+        "images"?: string[] | string;
+        /**
+          * Emitted when overlay closes
+         */
+        "onDropiClose"?: (event: DropiImageOverlayCustomEvent<void>) => void;
+        /**
+          * Whether the overlay is visible
+          * @default false
          */
-        "width"?: string;
+        "visible"?: boolean;
     }
     /**
      * @component dropi-input
@@ -1553,6 +2825,53 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    /**
+     * @component dropi-logo
+     * Displays the Dropi brand logo with size variants.
+     */
+    interface DropiLogo {
+        /**
+          * Size variant
+          * @default 'large'
+         */
+        "size"?: 'small' | 'large';
+        /**
+          * Theme (reserved for future use)
+          * @default 'light'
+         */
+        "theme"?: 'dark' | 'light';
+        /**
+          * Logo image URL
+          * @default ''
+         */
+        "urlLogo"?: string;
+    }
+    /**
+     * @component dropi-lottie-loader
+     * Full-screen or inline loading overlay with a Lottie animation.
+     */
+    interface DropiLottieLoader {
+        /**
+          * Title shown below the animation
+          * @default ''
+         */
+        "loaderTitle"?: string;
+        /**
+          * Path to the Lottie JSON animation file
+          * @default ''
+         */
+        "loadingAnimation"?: string;
+        /**
+          * Descriptive message below the title
+          * @default ''
+         */
+        "message"?: string;
+        /**
+          * Show or hide the loader
+          * @default false
+         */
+        "visible"?: boolean;
+    }
     /**
      * @component dropi-modal
      * Modal/dialog with backdrop, close button, and header/content/footer slots.
@@ -1599,6 +2918,40 @@ declare namespace LocalJSX {
          */
         "visible"?: boolean;
     }
+    /**
+     * @component dropi-otp-send-code
+     * 6-digit OTP input with countdown timer and resend capability.
+     */
+    interface DropiOtpSendCode {
+        /**
+          * Delivery method label
+          * @default 'email'
+         */
+        "engine"?: 'email' | 'sms' | '2fa';
+        /**
+          * Error message to display
+          * @default ''
+         */
+        "errorMessage"?: string;
+        /**
+          * Contact info (email/phone to show in label)
+          * @default ''
+         */
+        "labelContact"?: string;
+        /**
+          * Emitted when all 6 digits are entered. e.detail = the complete code string
+         */
+        "onDropiCodeCompleted"?: (event: DropiOtpSendCodeCustomEvent<string>) => void;
+        /**
+          * Emitted when resend is requested
+         */
+        "onDropiResend"?: (event: DropiOtpSendCodeCustomEvent<void>) => void;
+        /**
+          * Show contact label
+          * @default true
+         */
+        "showLabelContact"?: boolean;
+    }
     /**
      * @component dropi-paginator
      * Pagination control with page numbers, prev/next buttons and items-per-page selector.
@@ -1609,6 +2962,11 @@ declare namespace LocalJSX {
           * @default 5
          */
         "maxPages"?: number;
+        /**
+          * Hide "Anterior"/"Siguiente" text labels, show only arrows
+          * @default false
+         */
+        "noLabels"?: boolean;
         /**
           * Emitted when page changes. e.detail = { page, pageSize }
          */
@@ -1682,6 +3040,137 @@ declare namespace LocalJSX {
          */
         "resetTrigger"?: boolean;
     }
+    /**
+     * @component dropi-radio-selection-list
+     * List of radio button options with optional search filter.
+     */
+    interface DropiRadioSelectionList {
+        /**
+          * Search placeholder
+          * @default 'Buscar...'
+         */
+        "filterPlaceholder"?: string;
+        /**
+          * Emitted on selection change. e.detail = selected option id
+         */
+        "onDropiChange"?: (event: DropiRadioSelectionListCustomEvent<string | number>) => void;
+        /**
+          * Emitted on search. e.detail = search text
+         */
+        "onDropiSearch"?: (event: DropiRadioSelectionListCustomEvent<string>) => void;
+        /**
+          * Options array or JSON string
+          * @default []
+         */
+        "options"?: RadioOption[] | string;
+        /**
+          * Selected option id
+          * @default ''
+         */
+        "selectedOption"?: string | number;
+        /**
+          * Show search box
+          * @default false
+         */
+        "showFilter"?: boolean;
+        /**
+          * Show description below name
+          * @default 'default'
+         */
+        "typeLayout"?: 'description' | 'default';
+    }
+    /**
+     * @component dropi-read-more
+     * Truncates text to a word limit with an expandable "Ver más / Ver menos" toggle.
+     */
+    interface DropiReadMore {
+        /**
+          * Maximum number of words before truncating
+          * @default 20
+         */
+        "maxWords"?: number;
+        /**
+          * Allow collapsing back after expanding
+          * @default true
+         */
+        "showSeeLess"?: boolean;
+        /**
+          * Full text to display
+          * @default ''
+         */
+        "text"?: string;
+    }
+    /**
+     * @component dropi-search
+     * Text search input with optional dropdown results list.
+     * Supports single and multi-select, keyboard navigation, and clear button.
+     */
+    interface DropiSearch {
+        /**
+          * Max height of dropdown (CSS value)
+          * @default '240px'
+         */
+        "dropdownHeight"?: string;
+        /**
+          * Label shown above the input
+          * @default ''
+         */
+        "label"?: string;
+        /**
+          * Property name to display and search
+          * @default 'name'
+         */
+        "labelKey"?: string;
+        /**
+          * Max character length
+         */
+        "maxlength"?: number;
+        /**
+          * Allow multiple selection
+          * @default false
+         */
+        "multiSelect"?: boolean;
+        /**
+          * Emitted on blur
+         */
+        "onDropiBlur"?: (event: DropiSearchCustomEvent<void>) => void;
+        /**
+          * Emitted when selection changes. e.detail = selected items
+         */
+        "onDropiChange"?: (event: DropiSearchCustomEvent<SearchOption[]>) => void;
+        /**
+          * Emitted when clear button clicked
+         */
+        "onDropiClear"?: (event: DropiSearchCustomEvent<void>) => void;
+        /**
+          * Emitted on input change. e.detail = current text
+         */
+        "onDropiInput"?: (event: DropiSearchCustomEvent<string>) => void;
+        /**
+          * Emitted when Enter is pressed. e.detail = current text
+         */
+        "onDropiKeyEnter"?: (event: DropiSearchCustomEvent<string>) => void;
+        /**
+          * Data source to filter. Pass as array or JSON string
+          * @default []
+         */
+        "options"?: SearchOption[] | string;
+        /**
+          * Placeholder text
+          * @default 'Buscar...'
+         */
+        "placeholder"?: string;
+        /**
+          * Show clear (×) button when input has text
+          * @default true
+         */
+        "showClear"?: boolean;
+        /**
+          * Controlled input value
+          * @default ''
+         */
+        "value"?: string;
+    }
     /**
      * @component dropi-select
      * Feature-rich select with support for:
@@ -1809,6 +3298,37 @@ declare namespace LocalJSX {
          */
         "value"?: SelectOption | null;
     }
+    /**
+     * @component dropi-simple-stepper
+     * Compact horizontal stepper using dots or numbers.
+     */
+    interface DropiSimpleStepper {
+        /**
+          * Current active step (1-based)
+          * @default 1
+         */
+        "currentStep"?: number;
+        /**
+          * Flow mode (visual only)
+          * @default 'Sequential'
+         */
+        "flowMode"?: FlowMode;
+        /**
+          * Labels shown below each step. Pass as JSON string or array
+          * @default []
+         */
+        "labelStepper"?: string[] | string;
+        /**
+          * Total steps
+          * @default 3
+         */
+        "stepsCount"?: number;
+        /**
+          * Circle content: 'point' (dot) | 'number'
+          * @default 'number'
+         */
+        "typeStep"?: StepperType;
+    }
     /**
      * @component dropi-skeleton
      * Loading placeholder with shimmer animation.
@@ -1840,6 +3360,32 @@ declare namespace LocalJSX {
          */
         "width"?: string;
     }
+    /**
+     * @component dropi-steps
+     * Horizontal stepper showing step progress with number/title/description.
+     */
+    interface DropiSteps {
+        /**
+          * Active/current step index (1-based)
+          * @default 1
+         */
+        "currentStep"?: number;
+        /**
+          * Show step number inside the circle
+          * @default true
+         */
+        "showNumberOfStep"?: boolean;
+        /**
+          * Labels for each step. Pass as JSON string or array
+          * @default []
+         */
+        "stepLabels"?: StepLabel[] | string;
+        /**
+          * Total number of steps
+          * @default 3
+         */
+        "stepsCount"?: number;
+    }
     /**
      * @component dropi-switch
      * Toggle switch component. Emits dropiChange on toggle.
@@ -2018,6 +3564,17 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    /**
+     * @component dropi-time-line
+     * Vertical timeline showing ordered steps with status indicators.
+     */
+    interface DropiTimeLine {
+        /**
+          * Array of timeline steps. Pass as JSON string or array
+          * @default []
+         */
+        "steps"?: TimelineStep[] | string;
+    }
     /**
      * @component dropi-toast
      * Global toast notification stack. Place once in the app root, call show() from JS.
@@ -2065,6 +3622,36 @@ declare namespace LocalJSX {
          */
         "text"?: string;
     }
+    /**
+     * @component dropi-vertical-steps
+     * Vertical step-by-step progress indicator with optional click navigation.
+     */
+    interface DropiVerticalSteps {
+        /**
+          * Allow clicking completed steps to navigate back
+          * @default false
+         */
+        "clickable"?: boolean;
+        /**
+          * Currently active step (1-based)
+          * @default 1
+         */
+        "currentStep"?: number;
+        /**
+          * Emitted when a step is clicked. e.detail = step number (1-based)
+         */
+        "onDropiStepClick"?: (event: DropiVerticalStepsCustomEvent<number>) => void;
+        /**
+          * Show check icon inside completed step circles
+          * @default true
+         */
+        "showCheckIcon"?: boolean;
+        /**
+          * Array of steps. Pass as JSON string or array
+          * @default []
+         */
+        "steps"?: VerticalStep[] | string;
+    }
 
     interface DropiAccordionAttributes {
         "header": string;
@@ -2072,6 +3659,23 @@ declare namespace LocalJSX {
         "disabled": boolean;
         "preIcon": string;
     }
+    interface DropiAlertAttributes {
+        "message": string;
+        "type": AlertType;
+        "state": AlertState;
+        "dismissable": boolean;
+        "showButton": boolean;
+        "buttonText": string;
+        "anchorText": string;
+        "anchorUrl": string;
+        "showAlert": boolean;
+    }
+    interface DropiAvatarsAttributes {
+        "image": string;
+        "alt": string;
+        "type": AvatarType;
+        "initials": string;
+    }
     interface DropiBadgeAttributes {
         "state": BadgeState;
     }
@@ -2084,10 +3688,38 @@ declare namespace LocalJSX {
         "postIcon": string;
         "text": string;
     }
+    interface DropiCardSectionAttributes {
+        "sectionTitle": string;
+        "description": string;
+        "typeElement": 'dropdown' | 'switch';
+        "type": 'medium' | 'important';
+        "isChecked": boolean;
+    }
     interface DropiCheckboxAttributes {
         "checked": boolean;
         "disabled": boolean;
     }
+    interface DropiCheckboxSelectionListAttributes {
+        "options": CheckboxOption[] | string;
+        "showFilter": boolean;
+        "filterPlaceholder": string;
+        "showNotFound": boolean;
+        "notFoundMessage": string;
+        "multiSelect": boolean;
+    }
+    interface DropiChipsAttributes {
+        "chipStyle": ChipStyle;
+        "type": ChipType;
+        "urlImg": string;
+        "showIcon": boolean;
+        "icon": string;
+    }
+    interface DropiDropdownAttributes {
+        "options": DropdownOption[] | string;
+        "valueModel": string;
+        "imageModel": string;
+        "height": string;
+    }
     interface DropiEmptyStateAttributes {
         "header": string;
         "description": string;
@@ -2096,12 +3728,26 @@ declare namespace LocalJSX {
         "actionLabel": string;
         "secondaryLabel": string;
     }
+    interface DropiFavoriteButtonAttributes {
+        "isFavorite": boolean;
+    }
     interface DropiIconAttributes {
         "name": string;
         "width": string;
         "height": string;
         "color": string;
     }
+    interface DropiImageMiniatureAttributes {
+        "label": string;
+        "images": string[] | string;
+        "width": string;
+        "height": string;
+    }
+    interface DropiImageOverlayAttributes {
+        "visible": boolean;
+        "images": string[] | string;
+        "activeIndex": number;
+    }
     interface DropiInputAttributes {
         "inputId": string;
         "name": string;
@@ -2126,6 +3772,17 @@ declare namespace LocalJSX {
         "helperText": string;
         "showHelperOnlyOnError": boolean;
     }
+    interface DropiLogoAttributes {
+        "urlLogo": string;
+        "size": 'small' | 'large';
+        "theme": 'dark' | 'light';
+    }
+    interface DropiLottieLoaderAttributes {
+        "visible": boolean;
+        "loadingAnimation": string;
+        "loaderTitle": string;
+        "message": string;
+    }
     interface DropiModalAttributes {
         "visible": boolean;
         "header": string;
@@ -2137,11 +3794,18 @@ declare namespace LocalJSX {
         "position": ModalPosition;
         "size": ModalSize;
     }
+    interface DropiOtpSendCodeAttributes {
+        "engine": 'email' | 'sms' | '2fa';
+        "labelContact": string;
+        "showLabelContact": boolean;
+        "errorMessage": string;
+    }
     interface DropiPaginatorAttributes {
         "total": number;
         "pageSize": number;
         "page": number;
         "maxPages": number;
+        "noLabels": boolean;
         "showPageSizeSelector": boolean;
         "pageSizeOptions": number[] | string;
     }
@@ -2152,6 +3816,29 @@ declare namespace LocalJSX {
         "checked": boolean;
         "resetTrigger": boolean;
     }
+    interface DropiRadioSelectionListAttributes {
+        "options": RadioOption[] | string;
+        "selectedOption": string;
+        "showFilter": boolean;
+        "filterPlaceholder": string;
+        "typeLayout": 'description' | 'default';
+    }
+    interface DropiReadMoreAttributes {
+        "text": string;
+        "maxWords": number;
+        "showSeeLess": boolean;
+    }
+    interface DropiSearchAttributes {
+        "placeholder": string;
+        "value": string;
+        "maxlength": number;
+        "showClear": boolean;
+        "options": SearchOption[] | string;
+        "labelKey": string;
+        "multiSelect": boolean;
+        "dropdownHeight": string;
+        "label": string;
+    }
     interface DropiSelectAttributes {
         "label": string;
         "placeholder": string;
@@ -2170,6 +3857,13 @@ declare namespace LocalJSX {
         "preIcon": string;
         "defaultSelectedId": string;
     }
+    interface DropiSimpleStepperAttributes {
+        "stepsCount": number;
+        "typeStep": StepperType;
+        "currentStep": number;
+        "labelStepper": string[] | string;
+        "flowMode": FlowMode;
+    }
     interface DropiSkeletonAttributes {
         "variant": SkeletonVariant;
         "width": string;
@@ -2177,6 +3871,12 @@ declare namespace LocalJSX {
         "borderRadius": string;
         "lines": number;
     }
+    interface DropiStepsAttributes {
+        "stepsCount": number;
+        "showNumberOfStep": boolean;
+        "currentStep": number;
+        "stepLabels": StepLabel[] | string;
+    }
     interface DropiSwitchAttributes {
         "isChecked": boolean;
         "disabled": boolean;
@@ -2209,6 +3909,9 @@ declare namespace LocalJSX {
         "helperText": string;
         "invalid": boolean;
     }
+    interface DropiTimeLineAttributes {
+        "steps": TimelineStep[] | string;
+    }
     interface DropiToastAttributes {
         "position": 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' | 'top-center' | 'bottom-center';
         "life": number;
@@ -2219,26 +3922,51 @@ declare namespace LocalJSX {
         "maxWidth": string;
         "showDelay": number;
     }
+    interface DropiVerticalStepsAttributes {
+        "steps": VerticalStep[] | string;
+        "currentStep": number;
+        "clickable": boolean;
+        "showCheckIcon": boolean;
+    }
 
     interface IntrinsicElements {
         "dropi-accordion": Omit<DropiAccordion, keyof DropiAccordionAttributes> & { [K in keyof DropiAccordion & keyof DropiAccordionAttributes]?: DropiAccordion[K] } & { [K in keyof DropiAccordion & keyof DropiAccordionAttributes as `attr:${K}`]?: DropiAccordionAttributes[K] } & { [K in keyof DropiAccordion & keyof DropiAccordionAttributes as `prop:${K}`]?: DropiAccordion[K] };
+        "dropi-alert": Omit<DropiAlert, keyof DropiAlertAttributes> & { [K in keyof DropiAlert & keyof DropiAlertAttributes]?: DropiAlert[K] } & { [K in keyof DropiAlert & keyof DropiAlertAttributes as `attr:${K}`]?: DropiAlertAttributes[K] } & { [K in keyof DropiAlert & keyof DropiAlertAttributes as `prop:${K}`]?: DropiAlert[K] };
+        "dropi-avatars": Omit<DropiAvatars, keyof DropiAvatarsAttributes> & { [K in keyof DropiAvatars & keyof DropiAvatarsAttributes]?: DropiAvatars[K] } & { [K in keyof DropiAvatars & keyof DropiAvatarsAttributes as `attr:${K}`]?: DropiAvatarsAttributes[K] } & { [K in keyof DropiAvatars & keyof DropiAvatarsAttributes as `prop:${K}`]?: DropiAvatars[K] };
         "dropi-badge": Omit<DropiBadge, keyof DropiBadgeAttributes> & { [K in keyof DropiBadge & keyof DropiBadgeAttributes]?: DropiBadge[K] } & { [K in keyof DropiBadge & keyof DropiBadgeAttributes as `attr:${K}`]?: DropiBadgeAttributes[K] } & { [K in keyof DropiBadge & keyof DropiBadgeAttributes as `prop:${K}`]?: DropiBadge[K] };
         "dropi-button": Omit<DropiButton, keyof DropiButtonAttributes> & { [K in keyof DropiButton & keyof DropiButtonAttributes]?: DropiButton[K] } & { [K in keyof DropiButton & keyof DropiButtonAttributes as `attr:${K}`]?: DropiButtonAttributes[K] } & { [K in keyof DropiButton & keyof DropiButtonAttributes as `prop:${K}`]?: DropiButton[K] };
+        "dropi-card-section": Omit<DropiCardSection, keyof DropiCardSectionAttributes> & { [K in keyof DropiCardSection & keyof DropiCardSectionAttributes]?: DropiCardSection[K] } & { [K in keyof DropiCardSection & keyof DropiCardSectionAttributes as `attr:${K}`]?: DropiCardSectionAttributes[K] } & { [K in keyof DropiCardSection & keyof DropiCardSectionAttributes as `prop:${K}`]?: DropiCardSection[K] };
         "dropi-checkbox": Omit<DropiCheckbox, keyof DropiCheckboxAttributes> & { [K in keyof DropiCheckbox & keyof DropiCheckboxAttributes]?: DropiCheckbox[K] } & { [K in keyof DropiCheckbox & keyof DropiCheckboxAttributes as `attr:${K}`]?: DropiCheckboxAttributes[K] } & { [K in keyof DropiCheckbox & keyof DropiCheckboxAttributes as `prop:${K}`]?: DropiCheckbox[K] };
+        "dropi-checkbox-selection-list": Omit<DropiCheckboxSelectionList, keyof DropiCheckboxSelectionListAttributes> & { [K in keyof DropiCheckboxSelectionList & keyof DropiCheckboxSelectionListAttributes]?: DropiCheckboxSelectionList[K] } & { [K in keyof DropiCheckboxSelectionList & keyof DropiCheckboxSelectionListAttributes as `attr:${K}`]?: DropiCheckboxSelectionListAttributes[K] } & { [K in keyof DropiCheckboxSelectionList & keyof DropiCheckboxSelectionListAttributes as `prop:${K}`]?: DropiCheckboxSelectionList[K] };
+        "dropi-chips": Omit<DropiChips, keyof DropiChipsAttributes> & { [K in keyof DropiChips & keyof DropiChipsAttributes]?: DropiChips[K] } & { [K in keyof DropiChips & keyof DropiChipsAttributes as `attr:${K}`]?: DropiChipsAttributes[K] } & { [K in keyof DropiChips & keyof DropiChipsAttributes as `prop:${K}`]?: DropiChips[K] };
+        "dropi-dropdown": Omit<DropiDropdown, keyof DropiDropdownAttributes> & { [K in keyof DropiDropdown & keyof DropiDropdownAttributes]?: DropiDropdown[K] } & { [K in keyof DropiDropdown & keyof DropiDropdownAttributes as `attr:${K}`]?: DropiDropdownAttributes[K] } & { [K in keyof DropiDropdown & keyof DropiDropdownAttributes as `prop:${K}`]?: DropiDropdown[K] };
         "dropi-empty-state": Omit<DropiEmptyState, keyof DropiEmptyStateAttributes> & { [K in keyof DropiEmptyState & keyof DropiEmptyStateAttributes]?: DropiEmptyState[K] } & { [K in keyof DropiEmptyState & keyof DropiEmptyStateAttributes as `attr:${K}`]?: DropiEmptyStateAttributes[K] } & { [K in keyof DropiEmptyState & keyof DropiEmptyStateAttributes as `prop:${K}`]?: DropiEmptyState[K] };
+        "dropi-favorite-button": Omit<DropiFavoriteButton, keyof DropiFavoriteButtonAttributes> & { [K in keyof DropiFavoriteButton & keyof DropiFavoriteButtonAttributes]?: DropiFavoriteButton[K] } & { [K in keyof DropiFavoriteButton & keyof DropiFavoriteButtonAttributes as `attr:${K}`]?: DropiFavoriteButtonAttributes[K] } & { [K in keyof DropiFavoriteButton & keyof DropiFavoriteButtonAttributes as `prop:${K}`]?: DropiFavoriteButton[K] };
         "dropi-icon": Omit<DropiIcon, keyof DropiIconAttributes> & { [K in keyof DropiIcon & keyof DropiIconAttributes]?: DropiIcon[K] } & { [K in keyof DropiIcon & keyof DropiIconAttributes as `attr:${K}`]?: DropiIconAttributes[K] } & { [K in keyof DropiIcon & keyof DropiIconAttributes as `prop:${K}`]?: DropiIcon[K] };
+        "dropi-image-miniature": Omit<DropiImageMiniature, keyof DropiImageMiniatureAttributes> & { [K in keyof DropiImageMiniature & keyof DropiImageMiniatureAttributes]?: DropiImageMiniature[K] } & { [K in keyof DropiImageMiniature & keyof DropiImageMiniatureAttributes as `attr:${K}`]?: DropiImageMiniatureAttributes[K] } & { [K in keyof DropiImageMiniature & keyof DropiImageMiniatureAttributes as `prop:${K}`]?: DropiImageMiniature[K] };
+        "dropi-image-overlay": Omit<DropiImageOverlay, keyof DropiImageOverlayAttributes> & { [K in keyof DropiImageOverlay & keyof DropiImageOverlayAttributes]?: DropiImageOverlay[K] } & { [K in keyof DropiImageOverlay & keyof DropiImageOverlayAttributes as `attr:${K}`]?: DropiImageOverlayAttributes[K] } & { [K in keyof DropiImageOverlay & keyof DropiImageOverlayAttributes as `prop:${K}`]?: DropiImageOverlay[K] };
         "dropi-input": Omit<DropiInput, keyof DropiInputAttributes> & { [K in keyof DropiInput & keyof DropiInputAttributes]?: DropiInput[K] } & { [K in keyof DropiInput & keyof DropiInputAttributes as `attr:${K}`]?: DropiInputAttributes[K] } & { [K in keyof DropiInput & keyof DropiInputAttributes as `prop:${K}`]?: DropiInput[K] };
+        "dropi-logo": Omit<DropiLogo, keyof DropiLogoAttributes> & { [K in keyof DropiLogo & keyof DropiLogoAttributes]?: DropiLogo[K] } & { [K in keyof DropiLogo & keyof DropiLogoAttributes as `attr:${K}`]?: DropiLogoAttributes[K] } & { [K in keyof DropiLogo & keyof DropiLogoAttributes as `prop:${K}`]?: DropiLogo[K] };
+        "dropi-lottie-loader": Omit<DropiLottieLoader, keyof DropiLottieLoaderAttributes> & { [K in keyof DropiLottieLoader & keyof DropiLottieLoaderAttributes]?: DropiLottieLoader[K] } & { [K in keyof DropiLottieLoader & keyof DropiLottieLoaderAttributes as `attr:${K}`]?: DropiLottieLoaderAttributes[K] } & { [K in keyof DropiLottieLoader & keyof DropiLottieLoaderAttributes as `prop:${K}`]?: DropiLottieLoader[K] };
         "dropi-modal": Omit<DropiModal, keyof DropiModalAttributes> & { [K in keyof DropiModal & keyof DropiModalAttributes]?: DropiModal[K] } & { [K in keyof DropiModal & keyof DropiModalAttributes as `attr:${K}`]?: DropiModalAttributes[K] } & { [K in keyof DropiModal & keyof DropiModalAttributes as `prop:${K}`]?: DropiModal[K] };
+        "dropi-otp-send-code": Omit<DropiOtpSendCode, keyof DropiOtpSendCodeAttributes> & { [K in keyof DropiOtpSendCode & keyof DropiOtpSendCodeAttributes]?: DropiOtpSendCode[K] } & { [K in keyof DropiOtpSendCode & keyof DropiOtpSendCodeAttributes as `attr:${K}`]?: DropiOtpSendCodeAttributes[K] } & { [K in keyof DropiOtpSendCode & keyof DropiOtpSendCodeAttributes as `prop:${K}`]?: DropiOtpSendCode[K] };
         "dropi-paginator": Omit<DropiPaginator, keyof DropiPaginatorAttributes> & { [K in keyof DropiPaginator & keyof DropiPaginatorAttributes]?: DropiPaginator[K] } & { [K in keyof DropiPaginator & keyof DropiPaginatorAttributes as `attr:${K}`]?: DropiPaginatorAttributes[K] } & { [K in keyof DropiPaginator & keyof DropiPaginatorAttributes as `prop:${K}`]?: DropiPaginator[K] };
         "dropi-radio-button": Omit<DropiRadioButton, keyof DropiRadioButtonAttributes> & { [K in keyof DropiRadioButton & keyof DropiRadioButtonAttributes]?: DropiRadioButton[K] } & { [K in keyof DropiRadioButton & keyof DropiRadioButtonAttributes as `attr:${K}`]?: DropiRadioButtonAttributes[K] } & { [K in keyof DropiRadioButton & keyof DropiRadioButtonAttributes as `prop:${K}`]?: DropiRadioButton[K] };
+        "dropi-radio-selection-list": Omit<DropiRadioSelectionList, keyof DropiRadioSelectionListAttributes> & { [K in keyof DropiRadioSelectionList & keyof DropiRadioSelectionListAttributes]?: DropiRadioSelectionList[K] } & { [K in keyof DropiRadioSelectionList & keyof DropiRadioSelectionListAttributes as `attr:${K}`]?: DropiRadioSelectionListAttributes[K] } & { [K in keyof DropiRadioSelectionList & keyof DropiRadioSelectionListAttributes as `prop:${K}`]?: DropiRadioSelectionList[K] };
+        "dropi-read-more": Omit<DropiReadMore, keyof DropiReadMoreAttributes> & { [K in keyof DropiReadMore & keyof DropiReadMoreAttributes]?: DropiReadMore[K] } & { [K in keyof DropiReadMore & keyof DropiReadMoreAttributes as `attr:${K}`]?: DropiReadMoreAttributes[K] } & { [K in keyof DropiReadMore & keyof DropiReadMoreAttributes as `prop:${K}`]?: DropiReadMore[K] };
+        "dropi-search": Omit<DropiSearch, keyof DropiSearchAttributes> & { [K in keyof DropiSearch & keyof DropiSearchAttributes]?: DropiSearch[K] } & { [K in keyof DropiSearch & keyof DropiSearchAttributes as `attr:${K}`]?: DropiSearchAttributes[K] } & { [K in keyof DropiSearch & keyof DropiSearchAttributes as `prop:${K}`]?: DropiSearch[K] };
         "dropi-select": Omit<DropiSelect, keyof DropiSelectAttributes> & { [K in keyof DropiSelect & keyof DropiSelectAttributes]?: DropiSelect[K] } & { [K in keyof DropiSelect & keyof DropiSelectAttributes as `attr:${K}`]?: DropiSelectAttributes[K] } & { [K in keyof DropiSelect & keyof DropiSelectAttributes as `prop:${K}`]?: DropiSelect[K] };
+        "dropi-simple-stepper": Omit<DropiSimpleStepper, keyof DropiSimpleStepperAttributes> & { [K in keyof DropiSimpleStepper & keyof DropiSimpleStepperAttributes]?: DropiSimpleStepper[K] } & { [K in keyof DropiSimpleStepper & keyof DropiSimpleStepperAttributes as `attr:${K}`]?: DropiSimpleStepperAttributes[K] } & { [K in keyof DropiSimpleStepper & keyof DropiSimpleStepperAttributes as `prop:${K}`]?: DropiSimpleStepper[K] };
         "dropi-skeleton": Omit<DropiSkeleton, keyof DropiSkeletonAttributes> & { [K in keyof DropiSkeleton & keyof DropiSkeletonAttributes]?: DropiSkeleton[K] } & { [K in keyof DropiSkeleton & keyof DropiSkeletonAttributes as `attr:${K}`]?: DropiSkeletonAttributes[K] } & { [K in keyof DropiSkeleton & keyof DropiSkeletonAttributes as `prop:${K}`]?: DropiSkeleton[K] };
+        "dropi-steps": Omit<DropiSteps, keyof DropiStepsAttributes> & { [K in keyof DropiSteps & keyof DropiStepsAttributes]?: DropiSteps[K] } & { [K in keyof DropiSteps & keyof DropiStepsAttributes as `attr:${K}`]?: DropiStepsAttributes[K] } & { [K in keyof DropiSteps & keyof DropiStepsAttributes as `prop:${K}`]?: DropiSteps[K] };
         "dropi-switch": Omit<DropiSwitch, keyof DropiSwitchAttributes> & { [K in keyof DropiSwitch & keyof DropiSwitchAttributes]?: DropiSwitch[K] } & { [K in keyof DropiSwitch & keyof DropiSwitchAttributes as `attr:${K}`]?: DropiSwitchAttributes[K] } & { [K in keyof DropiSwitch & keyof DropiSwitchAttributes as `prop:${K}`]?: DropiSwitch[K] };
         "dropi-tabs": Omit<DropiTabs, keyof DropiTabsAttributes> & { [K in keyof DropiTabs & keyof DropiTabsAttributes]?: DropiTabs[K] } & { [K in keyof DropiTabs & keyof DropiTabsAttributes as `attr:${K}`]?: DropiTabsAttributes[K] } & { [K in keyof DropiTabs & keyof DropiTabsAttributes as `prop:${K}`]?: DropiTabs[K] };
         "dropi-tag": Omit<DropiTag, keyof DropiTagAttributes> & { [K in keyof DropiTag & keyof DropiTagAttributes]?: DropiTag[K] } & { [K in keyof DropiTag & keyof DropiTagAttributes as `attr:${K}`]?: DropiTagAttributes[K] } & { [K in keyof DropiTag & keyof DropiTagAttributes as `prop:${K}`]?: DropiTag[K] };
         "dropi-text-area": Omit<DropiTextArea, keyof DropiTextAreaAttributes> & { [K in keyof DropiTextArea & keyof DropiTextAreaAttributes]?: DropiTextArea[K] } & { [K in keyof DropiTextArea & keyof DropiTextAreaAttributes as `attr:${K}`]?: DropiTextAreaAttributes[K] } & { [K in keyof DropiTextArea & keyof DropiTextAreaAttributes as `prop:${K}`]?: DropiTextArea[K] };
+        "dropi-time-line": Omit<DropiTimeLine, keyof DropiTimeLineAttributes> & { [K in keyof DropiTimeLine & keyof DropiTimeLineAttributes]?: DropiTimeLine[K] } & { [K in keyof DropiTimeLine & keyof DropiTimeLineAttributes as `attr:${K}`]?: DropiTimeLineAttributes[K] } & { [K in keyof DropiTimeLine & keyof DropiTimeLineAttributes as `prop:${K}`]?: DropiTimeLine[K] };
         "dropi-toast": Omit<DropiToast, keyof DropiToastAttributes> & { [K in keyof DropiToast & keyof DropiToastAttributes]?: DropiToast[K] } & { [K in keyof DropiToast & keyof DropiToastAttributes as `attr:${K}`]?: DropiToastAttributes[K] } & { [K in keyof DropiToast & keyof DropiToastAttributes as `prop:${K}`]?: DropiToast[K] };
         "dropi-tooltip": Omit<DropiTooltip, keyof DropiTooltipAttributes> & { [K in keyof DropiTooltip & keyof DropiTooltipAttributes]?: DropiTooltip[K] } & { [K in keyof DropiTooltip & keyof DropiTooltipAttributes as `attr:${K}`]?: DropiTooltipAttributes[K] } & { [K in keyof DropiTooltip & keyof DropiTooltipAttributes as `prop:${K}`]?: DropiTooltip[K] };
+        "dropi-vertical-steps": Omit<DropiVerticalSteps, keyof DropiVerticalStepsAttributes> & { [K in keyof DropiVerticalSteps & keyof DropiVerticalStepsAttributes]?: DropiVerticalSteps[K] } & { [K in keyof DropiVerticalSteps & keyof DropiVerticalStepsAttributes as `attr:${K}`]?: DropiVerticalStepsAttributes[K] } & { [K in keyof DropiVerticalSteps & keyof DropiVerticalStepsAttributes as `prop:${K}`]?: DropiVerticalSteps[K] };
     }
 }
 export { LocalJSX as JSX };
@@ -2253,6 +3981,17 @@ declare module "@stencil/core" {
              * </dropi-accordion>
              */
             "dropi-accordion": LocalJSX.IntrinsicElements["dropi-accordion"] & JSXBase.HTMLAttributes<HTMLDropiAccordionElement>;
+            /**
+             * @component dropi-alert
+             * Alert banner with state variants (success/error/warning/info),
+             * optional action button, anchor link, and dismissable close icon.
+             */
+            "dropi-alert": LocalJSX.IntrinsicElements["dropi-alert"] & JSXBase.HTMLAttributes<HTMLDropiAlertElement>;
+            /**
+             * @component dropi-avatars
+             * Avatar component with image, initials fallback, and type-based size variants.
+             */
+            "dropi-avatars": LocalJSX.IntrinsicElements["dropi-avatars"] & JSXBase.HTMLAttributes<HTMLDropiAvatarsElement>;
             /**
              * @component dropi-badge
              * Status badge for user/account states.
@@ -2264,23 +4003,60 @@ declare module "@stencil/core" {
              * Supports pre/post icons and a loading spinner.
              */
             "dropi-button": LocalJSX.IntrinsicElements["dropi-button"] & JSXBase.HTMLAttributes<HTMLDropiButtonElement>;
+            /**
+             * @component dropi-card-section
+             * Section card with title, description and a switch or dropdown control.
+             */
+            "dropi-card-section": LocalJSX.IntrinsicElements["dropi-card-section"] & JSXBase.HTMLAttributes<HTMLDropiCardSectionElement>;
             /**
              * @component dropi-checkbox
              * A styled checkbox that emits change events.
              * Supports form association via native `<input type="checkbox">` internals.
              */
             "dropi-checkbox": LocalJSX.IntrinsicElements["dropi-checkbox"] & JSXBase.HTMLAttributes<HTMLDropiCheckboxElement>;
+            /**
+             * @component dropi-checkbox-selection-list
+             * Searchable list of checkbox options with multi-select support.
+             */
+            "dropi-checkbox-selection-list": LocalJSX.IntrinsicElements["dropi-checkbox-selection-list"] & JSXBase.HTMLAttributes<HTMLDropiCheckboxSelectionListElement>;
+            /**
+             * @component dropi-chips
+             * Chip/tag-like element with optional icon, avatar, and close button.
+             * Use <slot> for the chip label text.
+             */
+            "dropi-chips": LocalJSX.IntrinsicElements["dropi-chips"] & JSXBase.HTMLAttributes<HTMLDropiChipsElement>;
+            /**
+             * @component dropi-dropdown
+             * Scrollable list with checkboxes for multi-selection.
+             * Pass options as an array (JS) or JSON string.
+             */
+            "dropi-dropdown": LocalJSX.IntrinsicElements["dropi-dropdown"] & JSXBase.HTMLAttributes<HTMLDropiDropdownElement>;
             /**
              * @component dropi-empty-state
              * Empty state illustration with title, description and optional action button.
              */
             "dropi-empty-state": LocalJSX.IntrinsicElements["dropi-empty-state"] & JSXBase.HTMLAttributes<HTMLDropiEmptyStateElement>;
+            /**
+             * @component dropi-favorite-button
+             * Heart toggle button for marking items as favorite.
+             */
+            "dropi-favorite-button": LocalJSX.IntrinsicElements["dropi-favorite-button"] & JSXBase.HTMLAttributes<HTMLDropiFavoriteButtonElement>;
             /**
              * @component dropi-icon
              * Renders an SVG icon from the Dropi sprite sheet.
              * The sprite must be available at `assets/icons/sprite.svg`.
              */
             "dropi-icon": LocalJSX.IntrinsicElements["dropi-icon"] & JSXBase.HTMLAttributes<HTMLDropiIconElement>;
+            /**
+             * @component dropi-image-miniature
+             * Grid of image thumbnails with zoom-on-hover overlay trigger.
+             */
+            "dropi-image-miniature": LocalJSX.IntrinsicElements["dropi-image-miniature"] & JSXBase.HTMLAttributes<HTMLDropiImageMiniatureElement>;
+            /**
+             * @component dropi-image-overlay
+             * Full-screen image lightbox with prev/next navigation and thumbnails.
+             */
+            "dropi-image-overlay": LocalJSX.IntrinsicElements["dropi-image-overlay"] & JSXBase.HTMLAttributes<HTMLDropiImageOverlayElement>;
             /**
              * @component dropi-input
              * Text input with floating label, validation states, password toggle,
@@ -2295,12 +4071,27 @@ declare module "@stencil/core" {
              * Pass `value` and listen to `dropiInput` to update.
              */
             "dropi-input": LocalJSX.IntrinsicElements["dropi-input"] & JSXBase.HTMLAttributes<HTMLDropiInputElement>;
+            /**
+             * @component dropi-logo
+             * Displays the Dropi brand logo with size variants.
+             */
+            "dropi-logo": LocalJSX.IntrinsicElements["dropi-logo"] & JSXBase.HTMLAttributes<HTMLDropiLogoElement>;
+            /**
+             * @component dropi-lottie-loader
+             * Full-screen or inline loading overlay with a Lottie animation.
+             */
+            "dropi-lottie-loader": LocalJSX.IntrinsicElements["dropi-lottie-loader"] & JSXBase.HTMLAttributes<HTMLDropiLottieLoaderElement>;
             /**
              * @component dropi-modal
              * Modal/dialog with backdrop, close button, and header/content/footer slots.
              * Slots: (default) body, "header" custom header, "footer" actions.
              */
             "dropi-modal": LocalJSX.IntrinsicElements["dropi-modal"] & JSXBase.HTMLAttributes<HTMLDropiModalElement>;
+            /**
+             * @component dropi-otp-send-code
+             * 6-digit OTP input with countdown timer and resend capability.
+             */
+            "dropi-otp-send-code": LocalJSX.IntrinsicElements["dropi-otp-send-code"] & JSXBase.HTMLAttributes<HTMLDropiOtpSendCodeElement>;
             /**
              * @component dropi-paginator
              * Pagination control with page numbers, prev/next buttons and items-per-page selector.
@@ -2311,6 +4102,22 @@ declare module "@stencil/core" {
              * Styled radio button with label.
              */
             "dropi-radio-button": LocalJSX.IntrinsicElements["dropi-radio-button"] & JSXBase.HTMLAttributes<HTMLDropiRadioButtonElement>;
+            /**
+             * @component dropi-radio-selection-list
+             * List of radio button options with optional search filter.
+             */
+            "dropi-radio-selection-list": LocalJSX.IntrinsicElements["dropi-radio-selection-list"] & JSXBase.HTMLAttributes<HTMLDropiRadioSelectionListElement>;
+            /**
+             * @component dropi-read-more
+             * Truncates text to a word limit with an expandable "Ver más / Ver menos" toggle.
+             */
+            "dropi-read-more": LocalJSX.IntrinsicElements["dropi-read-more"] & JSXBase.HTMLAttributes<HTMLDropiReadMoreElement>;
+            /**
+             * @component dropi-search
+             * Text search input with optional dropdown results list.
+             * Supports single and multi-select, keyboard navigation, and clear button.
+             */
+            "dropi-search": LocalJSX.IntrinsicElements["dropi-search"] & JSXBase.HTMLAttributes<HTMLDropiSearchElement>;
             /**
              * @component dropi-select
              * Feature-rich select with support for:
@@ -2331,11 +4138,21 @@ declare module "@stencil/core" {
              * ```
              */
             "dropi-select": LocalJSX.IntrinsicElements["dropi-select"] & JSXBase.HTMLAttributes<HTMLDropiSelectElement>;
+            /**
+             * @component dropi-simple-stepper
+             * Compact horizontal stepper using dots or numbers.
+             */
+            "dropi-simple-stepper": LocalJSX.IntrinsicElements["dropi-simple-stepper"] & JSXBase.HTMLAttributes<HTMLDropiSimpleStepperElement>;
             /**
              * @component dropi-skeleton
              * Loading placeholder with shimmer animation.
              */
             "dropi-skeleton": LocalJSX.IntrinsicElements["dropi-skeleton"] & JSXBase.HTMLAttributes<HTMLDropiSkeletonElement>;
+            /**
+             * @component dropi-steps
+             * Horizontal stepper showing step progress with number/title/description.
+             */
+            "dropi-steps": LocalJSX.IntrinsicElements["dropi-steps"] & JSXBase.HTMLAttributes<HTMLDropiStepsElement>;
             /**
              * @component dropi-switch
              * Toggle switch component. Emits dropiChange on toggle.
@@ -2361,6 +4178,11 @@ declare module "@stencil/core" {
              * helper text, and native form association.
              */
             "dropi-text-area": LocalJSX.IntrinsicElements["dropi-text-area"] & JSXBase.HTMLAttributes<HTMLDropiTextAreaElement>;
+            /**
+             * @component dropi-time-line
+             * Vertical timeline showing ordered steps with status indicators.
+             */
+            "dropi-time-line": LocalJSX.IntrinsicElements["dropi-time-line"] & JSXBase.HTMLAttributes<HTMLDropiTimeLineElement>;
             /**
              * @component dropi-toast
              * Global toast notification stack. Place once in the app root, call show() from JS.
@@ -2376,6 +4198,11 @@ declare module "@stencil/core" {
              * </dropi-tooltip>
              */
             "dropi-tooltip": LocalJSX.IntrinsicElements["dropi-tooltip"] & JSXBase.HTMLAttributes<HTMLDropiTooltipElement>;
+            /**
+             * @component dropi-vertical-steps
+             * Vertical step-by-step progress indicator with optional click navigation.
+             */
+            "dropi-vertical-steps": LocalJSX.IntrinsicElements["dropi-vertical-steps"] & JSXBase.HTMLAttributes<HTMLDropiVerticalStepsElement>;
         }
     }
 }