@dropi/ui 0.1.37 → 0.1.42

package/dist/types/components.d.ts

@@ -30,7 +30,7 @@ import { SkeletonVariant } from "./components/dropi-skeleton/dropi-skeleton";
 import { StepLabel, StepState } from "./components/dropi-steps/dropi-steps";
 import { SortDir, TableColumn, TableRow } from "./components/dropi-table/dropi-table";
 import { TabItem } from "./components/dropi-tabs/dropi-tabs";
-import { TagState, TagType } from "./components/dropi-tag/dropi-tag";
+import { TagState, TagType, TagVariant } from "./components/dropi-tag/dropi-tag";
 import { ResizeMode, TextAreaProperties } 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";
@@ -61,7 +61,7 @@ export { SkeletonVariant } from "./components/dropi-skeleton/dropi-skeleton";
 export { StepLabel, StepState } from "./components/dropi-steps/dropi-steps";
 export { SortDir, TableColumn, TableRow } from "./components/dropi-table/dropi-table";
 export { TabItem } from "./components/dropi-tabs/dropi-tabs";
-export { TagState, TagType } from "./components/dropi-tag/dropi-tag";
+export { TagState, TagType, TagVariant } from "./components/dropi-tag/dropi-tag";
 export { ResizeMode, TextAreaProperties } 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";
@@ -117,12 +117,12 @@ export namespace Components {
     interface DropiAlert {
         /**
           * Anchor/link label
-          * @default 'none'
+          * @default ''
          */
         "anchorText": string;
         /**
           * Anchor href
-          * @default 'none'
+          * @default ''
          */
         "anchorUrl": string;
         /**
@@ -231,6 +231,11 @@ export namespace Components {
           * @default false
          */
         "isStep": boolean;
+        /**
+          * Use White Label (MB) illustration style instead of Lottie animation.
+          * @default false
+         */
+        "isWhiteLabel": boolean;
         /**
           * Show loading state with loading.json Lottie
           * @default false
@@ -1232,25 +1237,28 @@ export namespace Components {
      */
     interface DropiIcon {
         /**
-          * Color of the icon. Accepts: - Hex color: `#ff0000` - CSS variable name without `--`: `Primary-Primary-500` - `currentColor` to inherit
           * @default 'currentColor'
          */
         "color": string;
         /**
-          * Height of the icon (CSS value)
-          * @default '24px'
+          * @default '20px'
          */
-        "height": string;
+        "iconHeight": string;
+        /**
+          * Width of the icon (CSS value)
+          * @default '20px'
+         */
+        "iconWidth": string;
         /**
           * Icon name matching the id in the SVG sprite
           * @default ''
          */
         "name": string;
         /**
-          * Width of the icon (CSS value)
-          * @default '24px'
+          * Stroke width for icons that use strokes
+          * @default ''
          */
-        "width": string;
+        "strokeWidth": string;
     }
     /**
      * @component dropi-ilustration-icon
@@ -1375,7 +1383,7 @@ export namespace Components {
           * Input id. Defaults to label label.
           * @default ''
          */
-        "id": string;
+        "inputId": string;
         /**
           * Keyboard input mode hint
           * @default 'text'
@@ -1581,6 +1589,7 @@ export namespace Components {
           * @default true
          */
         "closeOnEscape": boolean;
+        "dismiss": () => Promise<void>;
         /**
           * @default true
          */
@@ -1593,11 +1602,6 @@ export namespace Components {
           * @default true
          */
         "dismissible": boolean;
-        /**
-          * No-op — kept for API parity with Angular (matches Angular `draggable`)
-          * @default false
-         */
-        "draggable": boolean;
         /**
           * Enable a before-close hook (matches Angular `enableBeforeClose`)
           * @default false
@@ -1607,7 +1611,11 @@ export namespace Components {
           * @default null
          */
         "header": string | null;
-        "hide": () => Promise<void>;
+        /**
+          * No-op — kept for API parity with Angular (matches Angular `draggable`)
+          * @default false
+         */
+        "isDraggable": boolean;
         /**
           * @default null
          */
@@ -1616,6 +1624,7 @@ export namespace Components {
           * @default true
          */
         "modal": boolean;
+        "openModalExternally": () => Promise<void>;
         /**
           * @default 'center'
          */
@@ -1625,7 +1634,6 @@ export namespace Components {
           * @default false
          */
         "resizable": boolean;
-        "show": () => Promise<void>;
         /**
           * @default true
          */
@@ -1654,7 +1662,7 @@ export namespace Components {
         /**
           * @default false
          */
-        "visible": any;
+        "visible": boolean;
     }
     /**
      * @component dropi-navbar
@@ -1709,9 +1717,14 @@ export namespace Components {
     }
     /**
      * @component dropi-otp-send-code
-     * 6-digit OTP input with countdown timer and resend capability.
+     * OTP input with configurable length, countdown timer and resend capability.
      */
     interface DropiOtpSendCode {
+        /**
+          * Number of digits for the OTP
+          * @default 6
+         */
+        "digitsCount": number;
         /**
           * Delivery method label
           * @default 'email'
@@ -1816,6 +1829,38 @@ export namespace Components {
          */
         "validateOnInit": boolean;
     }
+    interface DropiProgressBar {
+        /**
+          * Custom color for the progress fill (overrides severity)
+          * @default ''
+         */
+        "color": string;
+        /**
+          * Height of the progress bar
+          * @default '8px'
+         */
+        "height": string;
+        /**
+          * The color scheme of the progress bar
+          * @default 'primary'
+         */
+        "severity": 'primary' | 'success' | 'warning' | 'error' | 'info' | 'neutral';
+        /**
+          * Whether to show the value as text
+          * @default false
+         */
+        "showValue": boolean;
+        /**
+          * Background color of the track (optional, defaults to gray-100)
+          * @default 'var(--Gray-Gray-100, #F7F8FA)'
+         */
+        "trackColor": string;
+        /**
+          * The progress value (0-100)
+          * @default 0
+         */
+        "value": number;
+    }
     /**
      * @component dropi-radio-button
      * Styled radio button with label.
@@ -2122,6 +2167,11 @@ export namespace Components {
           * @default ''
          */
         "textHelper": string;
+        /**
+          * If true, uses absolute positioning instead of fixed (better for modals with transforms)
+          * @default false
+         */
+        "withinModal": boolean;
     }
     /**
      * @component dropi-sidebar
@@ -2353,7 +2403,7 @@ export namespace Components {
           * Table title
           * @default ''
          */
-        "title": string;
+        "tableTitle": string;
         /**
           * Total pages
           * @default 1
@@ -2425,6 +2475,11 @@ export namespace Components {
           * @default 'primary'
          */
         "type": TagType;
+        /**
+          * tag (default) | dot (status dot + text) | text (colored text only)
+          * @default 'tag'
+         */
+        "variant": TagVariant;
     }
     /**
      * @component dropi-tag-type-product
@@ -2898,9 +2953,9 @@ declare global {
         new (): HTMLDropiAccordionItemElement;
     };
     interface HTMLDropiAlertElementEventMap {
-        "onClose": void;
-        "onButtonClick": void;
-        "onClickLink": void;
+        "dropiClose": void;
+        "dropiButtonClick": void;
+        "dropiLinkClick": void;
     }
     /**
      * @component dropi-alert
@@ -2932,10 +2987,10 @@ declare global {
         new (): HTMLDropiAlertLegacyElement;
     };
     interface HTMLDropiAlertModalElementEventMap {
-        "primaryButtonEvent": boolean;
-        "secondaryButtonEvent": boolean;
-        "modalOpenChange": boolean;
-        "onHide": void;
+        "dropiPrimaryClick": boolean;
+        "dropiSecondaryClick": boolean;
+        "dropiVisibleChange": boolean;
+        "dropiHide": void;
     }
     /**
      * @component dropi-alert-modal
@@ -3040,7 +3095,7 @@ declare global {
         new (): HTMLDropiBreadcrumbElement;
     };
     interface HTMLDropiButtonElementEventMap {
-        "onClick": MouseEvent;
+        "dropiClick": MouseEvent;
     }
     /**
      * @component dropi-button
@@ -3062,7 +3117,7 @@ declare global {
         new (): HTMLDropiButtonElement;
     };
     interface HTMLDropiCardCheckboxElementEventMap {
-        "onChange": boolean;
+        "dropiChange": boolean;
     }
     /**
      * @component dropi-card-checkbox
@@ -3089,8 +3144,8 @@ declare global {
         new (): HTMLDropiCardCheckboxElement;
     };
     interface HTMLDropiCardProductElementEventMap {
-        "onProductClick": void;
-        "changeFavorite": boolean;
+        "dropiProductClick": void;
+        "dropiFavoriteChange": boolean;
         "dropiAddProduct": void;
         "dropiSupplierClick": void;
     }
@@ -3113,8 +3168,8 @@ declare global {
         new (): HTMLDropiCardProductElement;
     };
     interface HTMLDropiCardSectionElementEventMap {
-        "onChange": boolean;
-        "onClick": void;
+        "dropiChange": boolean;
+        "dropiClick": void;
     }
     /**
      * @component dropi-card-section
@@ -3135,8 +3190,8 @@ declare global {
         new (): HTMLDropiCardSectionElement;
     };
     interface HTMLDropiCarouselElementEventMap {
-        "pageChange": number;
-        "onPage": any;
+        "dropiPageChange": number;
+        "dropiPage": any;
     }
     interface HTMLDropiCarouselElement extends Components.DropiCarousel, HTMLStencilElement {
         addEventListener<K extends keyof HTMLDropiCarouselElementEventMap>(type: K, listener: (this: HTMLDropiCarouselElement, ev: DropiCarouselCustomEvent<HTMLDropiCarouselElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -3153,7 +3208,7 @@ declare global {
         new (): HTMLDropiCarouselElement;
     };
     interface HTMLDropiCheckboxElementEventMap {
-        "onChange": boolean;
+        "dropiChange": boolean;
     }
     /**
      * @component dropi-checkbox
@@ -3175,8 +3230,8 @@ declare global {
         new (): HTMLDropiCheckboxElement;
     };
     interface HTMLDropiCheckboxSelectionListElementEventMap {
-        "checkedValues": (string | number)[];
-        "onSearch": string;
+        "dropiCheckedValues": (string | number)[];
+        "dropiSearch": string;
     }
     /**
      * @component dropi-checkbox-selection-list
@@ -3197,7 +3252,7 @@ declare global {
         new (): HTMLDropiCheckboxSelectionListElement;
     };
     interface HTMLDropiChipsElementEventMap {
-        "onClose": void;
+        "dropiClose": void;
     }
     /**
      * @component dropi-chips
@@ -3273,7 +3328,7 @@ declare global {
         new (): HTMLDropiCountryFlagsElement;
     };
     interface HTMLDropiCountrySelectorElementEventMap {
-        "onChangeSelect": CountryItem;
+        "dropiChange": CountryItem;
     }
     /**
      * @component dropi-country-selector
@@ -3295,8 +3350,8 @@ declare global {
         new (): HTMLDropiCountrySelectorElement;
     };
     interface HTMLDropiDatePickerElementEventMap {
-        "onChangeDate": string;
-        "onClosePanel": void;
+        "dropiChangeDate": string;
+        "dropiClosePanel": void;
         "dropiRangeChange": { start: string; end: string };
     }
     /**
@@ -3540,10 +3595,10 @@ declare global {
         new (): HTMLDropiImageOverlayElement;
     };
     interface HTMLDropiInputElementEventMap {
-        "onInput": string;
-        "onChange": string;
-        "onFocus": void;
-        "onBlur": void;
+        "dropiInput": string;
+        "dropiChange": string;
+        "dropiFocus": void;
+        "dropiBlur": void;
     }
     /**
      * @component dropi-input
@@ -3573,7 +3628,7 @@ declare global {
         new (): HTMLDropiInputElement;
     };
     interface HTMLDropiLanguagesSelectorElementEventMap {
-        "languageChange": LanguageOption;
+        "dropiLanguageChange": LanguageOption;
     }
     /**
      * @component dropi-languages-selector
@@ -3635,9 +3690,9 @@ declare global {
         new (): HTMLDropiMediaPlayerElement;
     };
     interface HTMLDropiModalElementEventMap {
-        "onShow": void;
-        "onHide": void;
-        "visibleChange": boolean;
+        "dropiShow": void;
+        "dropiHide": void;
+        "dropiVisibleChange": boolean;
     }
     /**
      * @component dropi-modal
@@ -3684,11 +3739,12 @@ declare global {
     };
     interface HTMLDropiOtpSendCodeElementEventMap {
         "codeCompleted": string;
+        "codeAccepted": string;
         "dropiResend": void;
     }
     /**
      * @component dropi-otp-send-code
-     * 6-digit OTP input with countdown timer and resend capability.
+     * OTP input with configurable length, 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;
@@ -3705,7 +3761,7 @@ declare global {
         new (): HTMLDropiOtpSendCodeElement;
     };
     interface HTMLDropiPaginatorElementEventMap {
-        "pageChange": number;
+        "dropiPageChange": number;
     }
     /**
      * @component dropi-paginator
@@ -3726,10 +3782,10 @@ declare global {
         new (): HTMLDropiPaginatorElement;
     };
     interface HTMLDropiPhoneInputElementEventMap {
-        "ngModelChangeCod": string;
-        "ngModelChangePhone": string;
-        "verifiedField": void;
-        "onChangeSelect": any;
+        "dropiCodChange": string;
+        "dropiPhoneChange": string;
+        "dropiVerify": void;
+        "dropiChangeSelect": any;
     }
     /**
      * @component dropi-phone-input
@@ -3750,8 +3806,14 @@ declare global {
         prototype: HTMLDropiPhoneInputElement;
         new (): HTMLDropiPhoneInputElement;
     };
+    interface HTMLDropiProgressBarElement extends Components.DropiProgressBar, HTMLStencilElement {
+    }
+    var HTMLDropiProgressBarElement: {
+        prototype: HTMLDropiProgressBarElement;
+        new (): HTMLDropiProgressBarElement;
+    };
     interface HTMLDropiRadioButtonElementEventMap {
-        "onChange": any;
+        "dropiChange": any;
     }
     /**
      * @component dropi-radio-button
@@ -3772,8 +3834,8 @@ declare global {
         new (): HTMLDropiRadioButtonElement;
     };
     interface HTMLDropiRadioSelectionListElementEventMap {
-        "valueChange": string | number;
-        "onSearch": { searchValue: string; filteredOptions: RadioOption[] };
+        "dropiChange": string | number;
+        "dropiSearch": { searchValue: string; filteredOptions: RadioOption[] };
     }
     /**
      * @component dropi-radio-selection-list
@@ -3804,12 +3866,12 @@ declare global {
         new (): HTMLDropiReadMoreElement;
     };
     interface HTMLDropiSearchElementEventMap {
-        "onInput": string;
-        "onBlur": void;
-        "onKeyEnter": string;
-        "onChange": string;
-        "onClear": void;
-        "modelChange": SearchOption[];
+        "dropiInput": string;
+        "dropiBlur": void;
+        "dropiKeyEnter": string;
+        "dropiChange": string;
+        "dropiClear": void;
+        "dropiModelChange": SearchOption[];
     }
     /**
      * @component dropi-search
@@ -3831,11 +3893,11 @@ declare global {
         new (): HTMLDropiSearchElement;
     };
     interface HTMLDropiSelectElementEventMap {
-        "onChangeSelect": SelectOption | SelectOption[];
-        "onClear": void;
-        "onSearch": string;
-        "scrolledToEnd": void;
-        "onKeyEnter": KeyboardEvent;
+        "dropiChangeSelect": SelectOption | SelectOption[];
+        "dropiClear": void;
+        "dropiSearch": string;
+        "dropiScrollEnd": void;
+        "dropiKeyEnter": KeyboardEvent;
     }
     /**
      * @component dropi-select
@@ -3871,7 +3933,7 @@ declare global {
         new (): HTMLDropiSelectElement;
     };
     interface HTMLDropiSidebarElementEventMap {
-        "onIndexChanged": SidebarProperties;
+        "dropiIndexChange": SidebarProperties;
     }
     /**
      * @component dropi-sidebar
@@ -3923,7 +3985,7 @@ declare global {
         new (): HTMLDropiStepsElement;
     };
     interface HTMLDropiSwitchElementEventMap {
-        "onChange": boolean;
+        "dropiChange": boolean;
     }
     /**
      * @component dropi-switch
@@ -3951,12 +4013,12 @@ declare global {
         "dropiPageChange": number;
         "dropiPageSizeChange": number;
         "dropiAction": { row: TableRow; action: any };
-        "rowsSelected": any[];
-        "actionClicked": { row: any; action: any };
-        "onPageChange": number;
-        "onSizeChange": number;
-        "onSortChange": any;
-        "onSearchChange": string;
+        "dropiRowsSelected": any[];
+        "dropiActionClick": { row: any; action: any };
+        "dropiPageChangeAngular": number;
+        "dropiSizeChangeAngular": number;
+        "dropiSortChangeAngular": any;
+        "dropiSearchChangeAngular": string;
         "expandChildren": { row: any };
     }
     /**
@@ -3978,7 +4040,7 @@ declare global {
         new (): HTMLDropiTableElement;
     };
     interface HTMLDropiTabsElementEventMap {
-        "onIndexChanged": TabItem;
+        "dropiIndexChange": TabItem;
     }
     /**
      * @component dropi-tabs
@@ -4169,6 +4231,7 @@ declare global {
         "dropi-otp-send-code": HTMLDropiOtpSendCodeElement;
         "dropi-paginator": HTMLDropiPaginatorElement;
         "dropi-phone-input": HTMLDropiPhoneInputElement;
+        "dropi-progress-bar": HTMLDropiProgressBarElement;
         "dropi-radio-button": HTMLDropiRadioButtonElement;
         "dropi-radio-selection-list": HTMLDropiRadioSelectionListElement;
         "dropi-read-more": HTMLDropiReadMoreElement;
@@ -4242,12 +4305,12 @@ declare namespace LocalJSX {
     interface DropiAlert {
         /**
           * Anchor/link label
-          * @default 'none'
+          * @default ''
          */
         "anchorText"?: string;
         /**
           * Anchor href
-          * @default 'none'
+          * @default ''
          */
         "anchorUrl"?: string;
         /**
@@ -4278,15 +4341,15 @@ declare namespace LocalJSX {
         /**
           * Emitted when the action button is clicked
          */
-        "onOnButtonClick"?: (event: DropiAlertCustomEvent<void>) => void;
+        "onDropiButtonClick"?: (event: DropiAlertCustomEvent<void>) => void;
         /**
-          * Emitted when the anchor link is clicked
+          * Emitted when the alert is dismissed
          */
-        "onOnClickLink"?: (event: DropiAlertCustomEvent<void>) => void;
+        "onDropiClose"?: (event: DropiAlertCustomEvent<void>) => void;
         /**
-          * Emitted when the alert is dismissed
+          * Emitted when the anchor link is clicked
          */
-        "onOnClose"?: (event: DropiAlertCustomEvent<void>) => void;
+        "onDropiLinkClick"?: (event: DropiAlertCustomEvent<void>) => void;
         /**
           * Whether the alert is visible
           * @default true
@@ -4367,6 +4430,11 @@ declare namespace LocalJSX {
           * @default false
          */
         "isStep"?: boolean;
+        /**
+          * Use White Label (MB) illustration style instead of Lottie animation.
+          * @default false
+         */
+        "isWhiteLabel"?: boolean;
         /**
           * Show loading state with loading.json Lottie
           * @default false
@@ -4387,22 +4455,22 @@ declare namespace LocalJSX {
           * @default ''
          */
         "message"?: string;
-        /**
-          * Emitted when modal open state changes — matches Angular 'modalOpenChange'
-         */
-        "onModalOpenChange"?: (event: DropiAlertModalCustomEvent<boolean>) => void;
         /**
           * Emitted when modal is hidden — matches Angular 'onHide'
          */
-        "onOnHide"?: (event: DropiAlertModalCustomEvent<void>) => void;
+        "onDropiHide"?: (event: DropiAlertModalCustomEvent<void>) => void;
         /**
           * Emitted when primary button is clicked — matches Angular 'primaryButtonEvent'
          */
-        "onPrimaryButtonEvent"?: (event: DropiAlertModalCustomEvent<boolean>) => void;
+        "onDropiPrimaryClick"?: (event: DropiAlertModalCustomEvent<boolean>) => void;
         /**
           * Emitted when secondary button is clicked — matches Angular 'secondaryButtonEvent'
          */
-        "onSecondaryButtonEvent"?: (event: DropiAlertModalCustomEvent<boolean>) => void;
+        "onDropiSecondaryClick"?: (event: DropiAlertModalCustomEvent<boolean>) => void;
+        /**
+          * Emitted when modal open state changes — matches Angular 'modalOpenChange'
+         */
+        "onDropiVisibleChange"?: (event: DropiAlertModalCustomEvent<boolean>) => void;
         /**
           * Convenience object prop — matches Angular `params: ModalParams`. Fields: tittle, type, message, primaryButton, secondaryButton, loadingTitle, loadingMessage, closable, displayButtons. When provided, its values override the corresponding individual props.
           * @default null
@@ -4602,7 +4670,7 @@ declare namespace LocalJSX {
         /**
           * Emitted on click (not emitted when disabled or loading)
          */
-        "onOnClick"?: (event: DropiButtonCustomEvent<MouseEvent>) => void;
+        "onDropiClick"?: (event: DropiButtonCustomEvent<MouseEvent>) => void;
         /**
           * Icon name to show after the text
           * @default ''
@@ -4673,7 +4741,7 @@ declare namespace LocalJSX {
         /**
           * Emitted with the new checked state when clicked
          */
-        "onOnChange"?: (event: DropiCardCheckboxCustomEvent<boolean>) => void;
+        "onDropiChange"?: (event: DropiCardCheckboxCustomEvent<boolean>) => void;
         /**
           * Whether the checkbox is checked — matches Angular 'state'
           * @default 'checked'
@@ -4715,22 +4783,22 @@ declare namespace LocalJSX {
           * @default false
          */
         "isFavorite"?: boolean;
-        /**
-          * Emitted when favorite toggled — matches Angular 'changeFavorite'
-         */
-        "onChangeFavorite"?: (event: DropiCardProductCustomEvent<boolean>) => void;
         /**
           * Emitted when "Enviar a cliente" button clicked
          */
         "onDropiAddProduct"?: (event: DropiCardProductCustomEvent<void>) => void;
         /**
-          * Emitted when supplier name clicked
+          * Emitted when favorite toggled — matches Angular 'changeFavorite'
          */
-        "onDropiSupplierClick"?: (event: DropiCardProductCustomEvent<void>) => void;
+        "onDropiFavoriteChange"?: (event: DropiCardProductCustomEvent<boolean>) => void;
         /**
           * Emitted when card is clicked — matches Angular 'onProductClick'
          */
-        "onOnProductClick"?: (event: DropiCardProductCustomEvent<void>) => void;
+        "onDropiProductClick"?: (event: DropiCardProductCustomEvent<void>) => void;
+        /**
+          * Emitted when supplier name clicked
+         */
+        "onDropiSupplierClick"?: (event: DropiCardProductCustomEvent<void>) => void;
         /**
           * Product name
           * @default ''
@@ -4790,11 +4858,11 @@ declare namespace LocalJSX {
         /**
           * Emitted when switch changes
          */
-        "onOnChange"?: (event: DropiCardSectionCustomEvent<boolean>) => void;
+        "onDropiChange"?: (event: DropiCardSectionCustomEvent<boolean>) => void;
         /**
           * Emitted when dropdown icon is clicked
          */
-        "onOnClick"?: (event: DropiCardSectionCustomEvent<void>) => void;
+        "onDropiClick"?: (event: DropiCardSectionCustomEvent<void>) => void;
         /**
           * Section title — matches Angular 'title'
           * @default 'title'
@@ -4832,8 +4900,8 @@ declare namespace LocalJSX {
           * @default 1
          */
         "numVisible"?: number;
-        "onOnPage"?: (event: DropiCarouselCustomEvent<any>) => void;
-        "onPageChange"?: (event: DropiCarouselCustomEvent<number>) => void;
+        "onDropiPage"?: (event: DropiCarouselCustomEvent<any>) => void;
+        "onDropiPageChange"?: (event: DropiCarouselCustomEvent<number>) => void;
         /**
           * Orientation of the carousel
           * @default 'horizontal'
@@ -4887,7 +4955,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when the checked state changes
          */
-        "onOnChange"?: (event: DropiCheckboxCustomEvent<boolean>) => void;
+        "onDropiChange"?: (event: DropiCheckboxCustomEvent<boolean>) => void;
     }
     /**
      * @component dropi-checkbox-selection-list
@@ -4912,11 +4980,11 @@ declare namespace LocalJSX {
         /**
           * Emitted when selection changes — matches Angular 'checkedValues'
          */
-        "onCheckedValues"?: (event: DropiCheckboxSelectionListCustomEvent<(string | number)[]>) => void;
+        "onDropiCheckedValues"?: (event: DropiCheckboxSelectionListCustomEvent<(string | number)[]>) => void;
         /**
           * Emitted on search — matches Angular 'onSearch'
          */
-        "onOnSearch"?: (event: DropiCheckboxSelectionListCustomEvent<string>) => void;
+        "onDropiSearch"?: (event: DropiCheckboxSelectionListCustomEvent<string>) => void;
         /**
           * Options array or JSON string
           * @default []
@@ -4957,7 +5025,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when the close icon is clicked
          */
-        "onOnClose"?: (event: DropiChipsCustomEvent<void>) => void;
+        "onDropiClose"?: (event: DropiChipsCustomEvent<void>) => void;
         /**
           * Show the close/remove icon
           * @default false
@@ -5076,7 +5144,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when a country is selected. Detail is the CountryItem.
          */
-        "onOnChangeSelect"?: (event: DropiCountrySelectorCustomEvent<CountryItem>) => void;
+        "onDropiChange"?: (event: DropiCountrySelectorCustomEvent<CountryItem>) => void;
         /**
           * Placeholder when nothing is selected
           * @default 'Selecciona un país'
@@ -5144,18 +5212,18 @@ declare namespace LocalJSX {
           * @default ''
          */
         "minDate"?: string;
-        /**
-          * Emitted when range selected
-         */
-        "onDropiRangeChange"?: (event: DropiDatePickerCustomEvent<{ start: string; end: string }>) => void;
         /**
           * Emitted when date selected — matches Angular 'onChangeDate'
          */
-        "onOnChangeDate"?: (event: DropiDatePickerCustomEvent<string>) => void;
+        "onDropiChangeDate"?: (event: DropiDatePickerCustomEvent<string>) => void;
         /**
           * Emitted when panel closes — matches Angular 'onClosePanel'
          */
-        "onOnClosePanel"?: (event: DropiDatePickerCustomEvent<void>) => void;
+        "onDropiClosePanel"?: (event: DropiDatePickerCustomEvent<void>) => void;
+        /**
+          * Emitted when range selected
+         */
+        "onDropiRangeChange"?: (event: DropiDatePickerCustomEvent<{ start: string; end: string }>) => void;
         /**
           * Placeholder
           * @default 'DD/MM/YYYY'
@@ -5518,25 +5586,28 @@ declare namespace LocalJSX {
      */
     interface DropiIcon {
         /**
-          * Color of the icon. Accepts: - Hex color: `#ff0000` - CSS variable name without `--`: `Primary-Primary-500` - `currentColor` to inherit
           * @default 'currentColor'
          */
         "color"?: string;
         /**
-          * Height of the icon (CSS value)
-          * @default '24px'
+          * @default '20px'
          */
-        "height"?: string;
+        "iconHeight"?: string;
+        /**
+          * Width of the icon (CSS value)
+          * @default '20px'
+         */
+        "iconWidth"?: string;
         /**
           * Icon name matching the id in the SVG sprite
           * @default ''
          */
         "name"?: string;
         /**
-          * Width of the icon (CSS value)
-          * @default '24px'
+          * Stroke width for icons that use strokes
+          * @default ''
          */
-        "width"?: string;
+        "strokeWidth"?: string;
     }
     /**
      * @component dropi-ilustration-icon
@@ -5673,7 +5744,7 @@ declare namespace LocalJSX {
           * Input id. Defaults to label label.
           * @default ''
          */
-        "id"?: string;
+        "inputId"?: string;
         /**
           * Keyboard input mode hint
           * @default 'text'
@@ -5721,19 +5792,19 @@ declare namespace LocalJSX {
         /**
           * Emitted on blur
          */
-        "onOnBlur"?: (event: DropiInputCustomEvent<void>) => void;
+        "onDropiBlur"?: (event: DropiInputCustomEvent<void>) => void;
         /**
           * Emitted on blur with the final value
          */
-        "onOnChange"?: (event: DropiInputCustomEvent<string>) => void;
+        "onDropiChange"?: (event: DropiInputCustomEvent<string>) => void;
         /**
           * Emitted on focus
          */
-        "onOnFocus"?: (event: DropiInputCustomEvent<void>) => void;
+        "onDropiFocus"?: (event: DropiInputCustomEvent<void>) => void;
         /**
           * Emitted on every keystroke with the current value
          */
-        "onOnInput"?: (event: DropiInputCustomEvent<string>) => void;
+        "onDropiInput"?: (event: DropiInputCustomEvent<string>) => void;
         /**
           * Show password visibility toggle (renders as password field)
           * @default false
@@ -5783,7 +5854,7 @@ declare namespace LocalJSX {
           * @default []
          */
         "languages"?: LanguageOption[] | string;
-        "onLanguageChange"?: (event: DropiLanguagesSelectorCustomEvent<LanguageOption>) => void;
+        "onDropiLanguageChange"?: (event: DropiLanguagesSelectorCustomEvent<LanguageOption>) => void;
         /**
           * Currently selected language (LanguageOption or JSON string)
           * @default null
@@ -5910,11 +5981,6 @@ declare namespace LocalJSX {
           * @default true
          */
         "dismissible"?: boolean;
-        /**
-          * No-op — kept for API parity with Angular (matches Angular `draggable`)
-          * @default false
-         */
-        "draggable"?: boolean;
         /**
           * Enable a before-close hook (matches Angular `enableBeforeClose`)
           * @default false
@@ -5924,6 +5990,11 @@ declare namespace LocalJSX {
           * @default null
          */
         "header"?: string | null;
+        /**
+          * No-op — kept for API parity with Angular (matches Angular `draggable`)
+          * @default false
+         */
+        "isDraggable"?: boolean;
         /**
           * @default null
          */
@@ -5932,9 +6003,9 @@ declare namespace LocalJSX {
           * @default true
          */
         "modal"?: boolean;
-        "onOnHide"?: (event: DropiModalCustomEvent<void>) => void;
-        "onOnShow"?: (event: DropiModalCustomEvent<void>) => void;
-        "onVisibleChange"?: (event: DropiModalCustomEvent<boolean>) => void;
+        "onDropiHide"?: (event: DropiModalCustomEvent<void>) => void;
+        "onDropiShow"?: (event: DropiModalCustomEvent<void>) => void;
+        "onDropiVisibleChange"?: (event: DropiModalCustomEvent<boolean>) => void;
         /**
           * @default 'center'
          */
@@ -5972,7 +6043,7 @@ declare namespace LocalJSX {
         /**
           * @default false
          */
-        "visible"?: any;
+        "visible"?: boolean;
     }
     /**
      * @component dropi-navbar
@@ -6043,9 +6114,14 @@ declare namespace LocalJSX {
     }
     /**
      * @component dropi-otp-send-code
-     * 6-digit OTP input with countdown timer and resend capability.
+     * OTP input with configurable length, countdown timer and resend capability.
      */
     interface DropiOtpSendCode {
+        /**
+          * Number of digits for the OTP
+          * @default 6
+         */
+        "digitsCount"?: number;
         /**
           * Delivery method label
           * @default 'email'
@@ -6062,7 +6138,11 @@ declare namespace LocalJSX {
          */
         "labelContact"?: string;
         /**
-          * Emitted when all 6 digits are entered. e.detail = the complete code string
+          * Emitted when all digits are entered (alternative event).
+         */
+        "onCodeAccepted"?: (event: DropiOtpSendCodeCustomEvent<string>) => void;
+        /**
+          * Emitted when all digits are entered.
          */
         "onCodeCompleted"?: (event: DropiOtpSendCodeCustomEvent<string>) => void;
         /**
@@ -6108,7 +6188,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when page changes. e.detail = new page number
          */
-        "onPageChange"?: (event: DropiPaginatorCustomEvent<number>) => void;
+        "onDropiPageChange"?: (event: DropiPaginatorCustomEvent<number>) => void;
         /**
           * Total number of pages
           * @default 1
@@ -6142,21 +6222,21 @@ declare namespace LocalJSX {
          */
         "ngModelPhone"?: string;
         /**
-          * Emitted when country dial code changes — matches Angular 'ngModelChangeCod'
+          * Emitted when country selection changes — matches Angular 'onChangeSelect'
          */
-        "onNgModelChangeCod"?: (event: DropiPhoneInputCustomEvent<string>) => void;
+        "onDropiChangeSelect"?: (event: DropiPhoneInputCustomEvent<any>) => void;
         /**
-          * Emitted when phone number changes — matches Angular 'ngModelChangePhone'
+          * Emitted when country dial code changes — matches Angular 'ngModelChangeCod'
          */
-        "onNgModelChangePhone"?: (event: DropiPhoneInputCustomEvent<string>) => void;
+        "onDropiCodChange"?: (event: DropiPhoneInputCustomEvent<string>) => void;
         /**
-          * Emitted when country selection changes — matches Angular 'onChangeSelect'
+          * Emitted when phone number changes — matches Angular 'ngModelChangePhone'
          */
-        "onOnChangeSelect"?: (event: DropiPhoneInputCustomEvent<any>) => void;
+        "onDropiPhoneChange"?: (event: DropiPhoneInputCustomEvent<string>) => void;
         /**
           * Emitted on field verification — matches Angular 'verifiedField'
          */
-        "onVerifiedField"?: (event: DropiPhoneInputCustomEvent<void>) => void;
+        "onDropiVerify"?: (event: DropiPhoneInputCustomEvent<void>) => void;
         /**
           * Input placeholder — matches Angular 'phoneNumberPlaceholder'
           * @default null
@@ -6178,6 +6258,38 @@ declare namespace LocalJSX {
          */
         "validateOnInit"?: boolean;
     }
+    interface DropiProgressBar {
+        /**
+          * Custom color for the progress fill (overrides severity)
+          * @default ''
+         */
+        "color"?: string;
+        /**
+          * Height of the progress bar
+          * @default '8px'
+         */
+        "height"?: string;
+        /**
+          * The color scheme of the progress bar
+          * @default 'primary'
+         */
+        "severity"?: 'primary' | 'success' | 'warning' | 'error' | 'info' | 'neutral';
+        /**
+          * Whether to show the value as text
+          * @default false
+         */
+        "showValue"?: boolean;
+        /**
+          * Background color of the track (optional, defaults to gray-100)
+          * @default 'var(--Gray-Gray-100, #F7F8FA)'
+         */
+        "trackColor"?: string;
+        /**
+          * The progress value (0-100)
+          * @default 0
+         */
+        "value"?: number;
+    }
     /**
      * @component dropi-radio-button
      * Styled radio button with label.
@@ -6214,7 +6326,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when the radio is selected
          */
-        "onOnChange"?: (event: DropiRadioButtonCustomEvent<any>) => void;
+        "onDropiChange"?: (event: DropiRadioButtonCustomEvent<any>) => void;
         /**
           * Set to true to programmatically reset this radio to unchecked. Useful when the parent needs to clear a group.
           * @default false
@@ -6237,13 +6349,13 @@ declare namespace LocalJSX {
          */
         "filterPlaceholder"?: string;
         /**
-          * Emitted on search — matches Angular 'onSearch'
+          * Emitted on selection change. e.detail = selected option id
          */
-        "onOnSearch"?: (event: DropiRadioSelectionListCustomEvent<{ searchValue: string; filteredOptions: RadioOption[] }>) => void;
+        "onDropiChange"?: (event: DropiRadioSelectionListCustomEvent<string | number>) => void;
         /**
-          * Emitted on selection change. e.detail = selected option id
+          * Emitted on search — matches Angular 'onSearch'
          */
-        "onValueChange"?: (event: DropiRadioSelectionListCustomEvent<string | number>) => void;
+        "onDropiSearch"?: (event: DropiRadioSelectionListCustomEvent<{ searchValue: string; filteredOptions: RadioOption[] }>) => void;
         /**
           * Options array or JSON string
           * @default []
@@ -6341,30 +6453,30 @@ declare namespace LocalJSX {
           * @default true
          */
         "multipleSelectModel"?: boolean;
-        /**
-          * Emitted when selection changes. e.detail = selected items
-         */
-        "onModelChange"?: (event: DropiSearchCustomEvent<SearchOption[]>) => void;
         /**
           * Emitted on blur
          */
-        "onOnBlur"?: (event: DropiSearchCustomEvent<void>) => void;
+        "onDropiBlur"?: (event: DropiSearchCustomEvent<void>) => void;
         /**
           * Emitted on change event of the native input (matches Angular `onChange`)
          */
-        "onOnChange"?: (event: DropiSearchCustomEvent<string>) => void;
+        "onDropiChange"?: (event: DropiSearchCustomEvent<string>) => void;
         /**
           * Emitted when clear button clicked
          */
-        "onOnClear"?: (event: DropiSearchCustomEvent<void>) => void;
+        "onDropiClear"?: (event: DropiSearchCustomEvent<void>) => void;
         /**
           * Emitted on input change. e.detail = current text
          */
-        "onOnInput"?: (event: DropiSearchCustomEvent<string>) => void;
+        "onDropiInput"?: (event: DropiSearchCustomEvent<string>) => void;
         /**
           * Emitted when Enter is pressed. e.detail = current text
          */
-        "onOnKeyEnter"?: (event: DropiSearchCustomEvent<string>) => void;
+        "onDropiKeyEnter"?: (event: DropiSearchCustomEvent<string>) => void;
+        /**
+          * Emitted when selection changes. e.detail = selected items
+         */
+        "onDropiModelChange"?: (event: DropiSearchCustomEvent<SearchOption[]>) => void;
         /**
           * Placeholder text
           * @default 'Search...'
@@ -6462,23 +6574,23 @@ declare namespace LocalJSX {
         /**
           * Emitted when an option is selected — matches Angular 'onChangeSelect'
          */
-        "onOnChangeSelect"?: (event: DropiSelectCustomEvent<SelectOption | SelectOption[]>) => void;
+        "onDropiChangeSelect"?: (event: DropiSelectCustomEvent<SelectOption | SelectOption[]>) => void;
         /**
           * Emitted when the selection is cleared — matches Angular 'onClear'
          */
-        "onOnClear"?: (event: DropiSelectCustomEvent<void>) => void;
+        "onDropiClear"?: (event: DropiSelectCustomEvent<void>) => void;
         /**
           * Emitted on Enter key inside search — matches Angular 'onKeyEnter'
          */
-        "onOnKeyEnter"?: (event: DropiSelectCustomEvent<KeyboardEvent>) => void;
+        "onDropiKeyEnter"?: (event: DropiSelectCustomEvent<KeyboardEvent>) => void;
         /**
-          * Emitted on search input — matches Angular 'onSearch'
+          * Emitted when the list is scrolled to the end — matches Angular 'scrolledToEnd'
          */
-        "onOnSearch"?: (event: DropiSelectCustomEvent<string>) => void;
+        "onDropiScrollEnd"?: (event: DropiSelectCustomEvent<void>) => void;
         /**
-          * Emitted when the list is scrolled to the end — matches Angular 'scrolledToEnd'
+          * Emitted on search input — matches Angular 'onSearch'
          */
-        "onScrolledToEnd"?: (event: DropiSelectCustomEvent<void>) => void;
+        "onDropiSearch"?: (event: DropiSelectCustomEvent<string>) => void;
         /**
           * Array of SelectOption or SelectOptionGroup
           * @default []
@@ -6536,6 +6648,11 @@ declare namespace LocalJSX {
           * @default ''
          */
         "textHelper"?: string;
+        /**
+          * If true, uses absolute positioning instead of fixed (better for modals with transforms)
+          * @default false
+         */
+        "withinModal"?: boolean;
     }
     /**
      * @component dropi-sidebar
@@ -6546,7 +6663,7 @@ declare namespace LocalJSX {
         /**
           * Evento emitido cuando se selecciona una opción en el menú o un sub-hijo.
          */
-        "onOnIndexChanged"?: (event: DropiSidebarCustomEvent<SidebarProperties>) => void;
+        "onDropiIndexChange"?: (event: DropiSidebarCustomEvent<SidebarProperties>) => void;
         /**
           * Define las propiedades y la cantidad de elementos a renderizar. Pasarlo como JSON string o directamente como array de SidebarProperties.
           * @default []
@@ -6682,7 +6799,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when the toggle state changes
          */
-        "onOnChange"?: (event: DropiSwitchCustomEvent<boolean>) => void;
+        "onDropiChange"?: (event: DropiSwitchCustomEvent<boolean>) => void;
     }
     /**
      * @component dropi-table
@@ -6739,41 +6856,41 @@ declare namespace LocalJSX {
           * @default false
          */
         "loading"?: boolean;
+        "onDropiAction"?: (event: DropiTableCustomEvent<{ row: TableRow; action: any }>) => void;
         /**
           * Matches Angular `actionClicked`
          */
-        "onActionClicked"?: (event: DropiTableCustomEvent<{ row: any; action: any }>) => void;
-        "onDropiAction"?: (event: DropiTableCustomEvent<{ row: TableRow; action: any }>) => void;
+        "onDropiActionClick"?: (event: DropiTableCustomEvent<{ row: any; action: any }>) => void;
         "onDropiPageChange"?: (event: DropiTableCustomEvent<number>) => void;
-        "onDropiPageSizeChange"?: (event: DropiTableCustomEvent<number>) => void;
-        "onDropiRowClick"?: (event: DropiTableCustomEvent<{ row: TableRow; index: number }>) => void;
-        "onDropiSearch"?: (event: DropiTableCustomEvent<string>) => void;
-        "onDropiSelection"?: (event: DropiTableCustomEvent<number[]>) => void;
-        "onDropiSort"?: (event: DropiTableCustomEvent<{ key: string; dir: SortDir }>) => void;
         /**
-          * Matches Angular `expandChildren`
+          * Matches Angular `onPageChange`
          */
-        "onExpandChildren"?: (event: DropiTableCustomEvent<{ row: any }>) => void;
+        "onDropiPageChangeAngular"?: (event: DropiTableCustomEvent<number>) => void;
+        "onDropiPageSizeChange"?: (event: DropiTableCustomEvent<number>) => void;
+        "onDropiRowClick"?: (event: DropiTableCustomEvent<{ row: TableRow; index: number }>) => void;
         /**
-          * Matches Angular `onPageChange`
+          * Matches Angular `rowsSelected`
          */
-        "onOnPageChange"?: (event: DropiTableCustomEvent<number>) => void;
+        "onDropiRowsSelected"?: (event: DropiTableCustomEvent<any[]>) => void;
+        "onDropiSearch"?: (event: DropiTableCustomEvent<string>) => void;
         /**
           * Matches Angular `onSearchChange`
          */
-        "onOnSearchChange"?: (event: DropiTableCustomEvent<string>) => void;
+        "onDropiSearchChangeAngular"?: (event: DropiTableCustomEvent<string>) => void;
+        "onDropiSelection"?: (event: DropiTableCustomEvent<number[]>) => void;
         /**
           * Matches Angular `onSizeChange`
          */
-        "onOnSizeChange"?: (event: DropiTableCustomEvent<number>) => void;
+        "onDropiSizeChangeAngular"?: (event: DropiTableCustomEvent<number>) => void;
+        "onDropiSort"?: (event: DropiTableCustomEvent<{ key: string; dir: SortDir }>) => void;
         /**
           * Matches Angular `onSortChange`
          */
-        "onOnSortChange"?: (event: DropiTableCustomEvent<any>) => void;
+        "onDropiSortChangeAngular"?: (event: DropiTableCustomEvent<any>) => void;
         /**
-          * Matches Angular `rowsSelected`
+          * Matches Angular `expandChildren`
          */
-        "onRowsSelected"?: (event: DropiTableCustomEvent<any[]>) => void;
+        "onExpandChildren"?: (event: DropiTableCustomEvent<{ row: any }>) => void;
         /**
           * Page sizes options
           * @default [5, 10, 25, 50]
@@ -6818,7 +6935,7 @@ declare namespace LocalJSX {
           * Table title
           * @default ''
          */
-        "title"?: string;
+        "tableTitle"?: string;
         /**
           * Total pages
           * @default 1
@@ -6852,7 +6969,7 @@ declare namespace LocalJSX {
         /**
           * Emitted on tab click. e.detail = TabItem
          */
-        "onOnIndexChanged"?: (event: DropiTabsCustomEvent<TabItem>) => void;
+        "onDropiIndexChange"?: (event: DropiTabsCustomEvent<TabItem>) => void;
         /**
           * Whether to show a check/pending icon per tab
           * @default false
@@ -6894,6 +7011,11 @@ declare namespace LocalJSX {
           * @default 'primary'
          */
         "type"?: TagType;
+        /**
+          * tag (default) | dot (status dot + text) | text (colored text only)
+          * @default 'tag'
+         */
+        "variant"?: TagVariant;
     }
     /**
      * @component dropi-tag-type-product
@@ -7227,6 +7349,7 @@ declare namespace LocalJSX {
         "loadingMessage": string;
         "isStep": boolean;
         "baseZIndex": number;
+        "isWhiteLabel": boolean;
         "params": string;
     }
     interface DropiAvatarsAttributes {
@@ -7433,9 +7556,10 @@ declare namespace LocalJSX {
     }
     interface DropiIconAttributes {
         "name": string;
-        "width": string;
-        "height": string;
+        "iconWidth": string;
+        "iconHeight": string;
         "color": string;
+        "strokeWidth": string;
     }
     interface DropiIlustrationIconAttributes {
         "type": IlustrationType;
@@ -7455,7 +7579,7 @@ declare namespace LocalJSX {
         "activeIndex": number;
     }
     interface DropiInputAttributes {
-        "id": string;
+        "inputId": string;
         "name": string;
         "label": string;
         "placeholder": string;
@@ -7504,7 +7628,7 @@ declare namespace LocalJSX {
         "format": 'mobile-vertical' | 'mobile-compact' | 'desktop';
     }
     interface DropiModalAttributes {
-        "visible": string;
+        "visible": boolean;
         "header": string | null;
         "showCloseIcon": boolean;
         "dismissable": boolean;
@@ -7524,7 +7648,7 @@ declare namespace LocalJSX {
         "baseZIndex": number;
         "transitionOptions": string;
         "enableBeforeClose": boolean;
-        "draggable": boolean;
+        "isDraggable": boolean;
         "resizable": boolean;
     }
     interface DropiNavbarAttributes {
@@ -7543,6 +7667,7 @@ declare namespace LocalJSX {
         "labelContact": string;
         "showLabelContact": boolean;
         "errorMessage": string;
+        "digitsCount": number;
     }
     interface DropiPaginatorAttributes {
         "totalPages": number;
@@ -7562,6 +7687,14 @@ declare namespace LocalJSX {
         "selectedOption": string;
         "selectProperties": string;
     }
+    interface DropiProgressBarAttributes {
+        "value": number;
+        "severity": 'primary' | 'success' | 'warning' | 'error' | 'info' | 'neutral';
+        "height": string;
+        "showValue": boolean;
+        "trackColor": string;
+        "color": string;
+    }
     interface DropiRadioButtonAttributes {
         "label": string;
         "name": string;
@@ -7619,6 +7752,7 @@ declare namespace LocalJSX {
         "preIcon": string;
         "defaultSelectedId": string;
         "overlayClass": string;
+        "withinModal": boolean;
         "selectProperties": string;
     }
     interface DropiSidebarAttributes {
@@ -7657,7 +7791,7 @@ declare namespace LocalJSX {
         "showCheckbox": boolean;
         "loading": boolean;
         "emptyMessage": string;
-        "title": string;
+        "tableTitle": string;
         "showSearch": boolean;
         "showColumnSelector": boolean;
         "showPaginator": boolean;
@@ -7680,6 +7814,7 @@ declare namespace LocalJSX {
         "stopAction": boolean;
     }
     interface DropiTagAttributes {
+        "variant": TagVariant;
         "type": TagType;
         "state": TagState;
         "showIcon": boolean;
@@ -7790,6 +7925,7 @@ declare namespace LocalJSX {
         "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-phone-input": Omit<DropiPhoneInput, keyof DropiPhoneInputAttributes> & { [K in keyof DropiPhoneInput & keyof DropiPhoneInputAttributes]?: DropiPhoneInput[K] } & { [K in keyof DropiPhoneInput & keyof DropiPhoneInputAttributes as `attr:${K}`]?: DropiPhoneInputAttributes[K] } & { [K in keyof DropiPhoneInput & keyof DropiPhoneInputAttributes as `prop:${K}`]?: DropiPhoneInput[K] };
+        "dropi-progress-bar": Omit<DropiProgressBar, keyof DropiProgressBarAttributes> & { [K in keyof DropiProgressBar & keyof DropiProgressBarAttributes]?: DropiProgressBar[K] } & { [K in keyof DropiProgressBar & keyof DropiProgressBarAttributes as `attr:${K}`]?: DropiProgressBarAttributes[K] } & { [K in keyof DropiProgressBar & keyof DropiProgressBarAttributes as `prop:${K}`]?: DropiProgressBar[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] };
@@ -8062,7 +8198,7 @@ declare module "@stencil/core" {
             "dropi-navbar": LocalJSX.IntrinsicElements["dropi-navbar"] & JSXBase.HTMLAttributes<HTMLDropiNavbarElement>;
             /**
              * @component dropi-otp-send-code
-             * 6-digit OTP input with countdown timer and resend capability.
+             * OTP input with configurable length, countdown timer and resend capability.
              */
             "dropi-otp-send-code": LocalJSX.IntrinsicElements["dropi-otp-send-code"] & JSXBase.HTMLAttributes<HTMLDropiOtpSendCodeElement>;
             /**
@@ -8076,6 +8212,7 @@ declare module "@stencil/core" {
              * Syncs perfectly with dropi-core_front natively
              */
             "dropi-phone-input": LocalJSX.IntrinsicElements["dropi-phone-input"] & JSXBase.HTMLAttributes<HTMLDropiPhoneInputElement>;
+            "dropi-progress-bar": LocalJSX.IntrinsicElements["dropi-progress-bar"] & JSXBase.HTMLAttributes<HTMLDropiProgressBarElement>;
             /**
              * @component dropi-radio-button
              * Styled radio button with label.