@beeq/angular 1.12.14-beta.0 → 1.13.0

package/types/beeq-angular.d.ts

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { ElementRef, NgZone, EventEmitter, ChangeDetectorRef, ModuleWithProviders } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
-import { Components, TSliderValue } from '@beeq/core';
+import { Components, BqAccordionCustomEvent, BqAlertCustomEvent, BqBreadcrumbItemCustomEvent, BqButtonCustomEvent, BqCheckboxCustomEvent, BqDatePickerCustomEvent, TCalendarView, BqDialogCustomEvent, BqDrawerCustomEvent, BqDropdownCustomEvent, BqIconCustomEvent, BqInputCustomEvent, BqNotificationCustomEvent, BqOptionCustomEvent, BqOptionListCustomEvent, BqRadioCustomEvent, BqRadioGroupCustomEvent, BqSelectCustomEvent, BqSideMenuCustomEvent, BqSideMenuItemCustomEvent, BqSliderCustomEvent, TSliderValue, BqStepItemCustomEvent, BqSwitchCustomEvent, BqTabCustomEvent, BqTabGroupCustomEvent, BqTagCustomEvent, BqTextareaCustomEvent, BqToastCustomEvent, BqTooltipCustomEvent } from '@beeq/core';
 import * as i7 from '@angular/common';
 
 declare class ValueAccessor implements ControlValueAccessor {
@@ -80,13 +80,13 @@ If true, the Accordion animation, will be disabled. No animation will be applied
    * The size of the Accordion @default 'medium'
    */
     set size(_: Components.BqAccordion['size']);
-    bqBlur: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
-    bqOpen: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
-    bqAfterOpen: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
-    bqClose: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
-    bqAfterClose: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
-    bqClick: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
+    bqBlur: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
+    bqFocus: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
+    bqOpen: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
+    bqAfterOpen: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
+    bqClose: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
+    bqAfterClose: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
+    bqClick: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqAccordion, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqAccordion, "bq-accordion", never, { "appearance": { "alias": "appearance"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "expanded": { "alias": "expanded"; "required": false; }; "noAnimation": { "alias": "noAnimation"; "required": false; }; "rotate": { "alias": "rotate"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "bqBlur": "bqBlur"; "bqFocus": "bqFocus"; "bqOpen": "bqOpen"; "bqAfterOpen": "bqAfterOpen"; "bqClose": "bqClose"; "bqAfterClose": "bqAfterClose"; "bqClick": "bqClick"; }, never, ["*"], false, never>;
@@ -95,31 +95,31 @@ declare interface BqAccordion extends Components.BqAccordion {
     /**
      * Handler to be called when the accordion loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
+    bqBlur: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
     /**
      * Handler to be called when the accordion gets focus
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
+    bqFocus: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
     /**
      * Handler to be called when the accordion is opened
      */
-    bqOpen: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
+    bqOpen: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
     /**
      * Handler to be called after the accordion is opened
      */
-    bqAfterOpen: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
+    bqAfterOpen: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
     /**
      * Handler to be called when the accordion is closed
      */
-    bqClose: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
+    bqClose: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
     /**
      * Handler to be called after the accordion is closed
      */
-    bqAfterClose: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
+    bqAfterClose: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
     /**
      * Handler to be called when the accordion is clicked
      */
-    bqClick: EventEmitter<CustomEvent<HTMLBqAccordionElement>>;
+    bqClick: EventEmitter<BqAccordionCustomEvent<HTMLBqAccordionElement>>;
 }
 declare class BqAccordionGroup {
     protected z: NgZone;
@@ -186,10 +186,10 @@ declare class BqAlert {
    * If true, the alert component will remain fixed at the top of the page, occupying the full viewport
    */
     set sticky(_: Components.BqAlert['sticky']);
-    bqHide: EventEmitter<CustomEvent<any>>;
-    bqShow: EventEmitter<CustomEvent<any>>;
-    bqAfterShow: EventEmitter<CustomEvent<any>>;
-    bqAfterHide: EventEmitter<CustomEvent<any>>;
+    bqHide: EventEmitter<BqAlertCustomEvent<any>>;
+    bqShow: EventEmitter<BqAlertCustomEvent<any>>;
+    bqAfterShow: EventEmitter<BqAlertCustomEvent<any>>;
+    bqAfterHide: EventEmitter<BqAlertCustomEvent<any>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqAlert, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqAlert, "bq-alert", never, { "autoDismiss": { "alias": "autoDismiss"; "required": false; }; "border": { "alias": "border"; "required": false; }; "disableClose": { "alias": "disableClose"; "required": false; }; "hideIcon": { "alias": "hideIcon"; "required": false; }; "open": { "alias": "open"; "required": false; }; "sticky": { "alias": "sticky"; "required": false; }; "time": { "alias": "time"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, { "bqHide": "bqHide"; "bqShow": "bqShow"; "bqAfterShow": "bqAfterShow"; "bqAfterHide": "bqAfterHide"; }, never, ["*"], false, never>;
@@ -198,19 +198,19 @@ declare interface BqAlert extends Components.BqAlert {
     /**
      * Callback handler to be called when the alert is hidden
      */
-    bqHide: EventEmitter<CustomEvent<any>>;
+    bqHide: EventEmitter<BqAlertCustomEvent<any>>;
     /**
      * Callback handler to be called when the alert is shown
      */
-    bqShow: EventEmitter<CustomEvent<any>>;
+    bqShow: EventEmitter<BqAlertCustomEvent<any>>;
     /**
      * Callback handler to be called after the alert has been shown
      */
-    bqAfterShow: EventEmitter<CustomEvent<any>>;
+    bqAfterShow: EventEmitter<BqAlertCustomEvent<any>>;
     /**
      * Callback handler to be called after the alert has been hidden
      */
-    bqAfterHide: EventEmitter<CustomEvent<any>>;
+    bqAfterHide: EventEmitter<BqAlertCustomEvent<any>>;
 }
 declare class BqAvatar {
     protected z: NgZone;
@@ -294,9 +294,9 @@ declare class BqBreadcrumbItem {
    * Where to display the link in the browser context. Relevant only if `href` is set. @default 'noreferrer noopener'
    */
     set rel(_: Components.BqBreadcrumbItem['rel']);
-    bqBlur: EventEmitter<CustomEvent<HTMLBqBreadcrumbItemElement>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqBreadcrumbItemElement>>;
-    bqClick: EventEmitter<CustomEvent<HTMLBqBreadcrumbItemElement>>;
+    bqBlur: EventEmitter<BqBreadcrumbItemCustomEvent<HTMLBqBreadcrumbItemElement>>;
+    bqFocus: EventEmitter<BqBreadcrumbItemCustomEvent<HTMLBqBreadcrumbItemElement>>;
+    bqClick: EventEmitter<BqBreadcrumbItemCustomEvent<HTMLBqBreadcrumbItemElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqBreadcrumbItem, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqBreadcrumbItem, "bq-breadcrumb-item", never, { "href": { "alias": "href"; "required": false; }; "rel": { "alias": "rel"; "required": false; }; "target": { "alias": "target"; "required": false; }; }, { "bqBlur": "bqBlur"; "bqFocus": "bqFocus"; "bqClick": "bqClick"; }, never, ["*"], false, never>;
@@ -305,15 +305,15 @@ declare interface BqBreadcrumbItem extends Components.BqBreadcrumbItem {
     /**
      * Handler to be called when item loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqBreadcrumbItemElement>>;
+    bqBlur: EventEmitter<BqBreadcrumbItemCustomEvent<HTMLBqBreadcrumbItemElement>>;
     /**
      * Handler to be called when item is focused
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqBreadcrumbItemElement>>;
+    bqFocus: EventEmitter<BqBreadcrumbItemCustomEvent<HTMLBqBreadcrumbItemElement>>;
     /**
      * Handler to be called when item is clicked
      */
-    bqClick: EventEmitter<CustomEvent<HTMLBqBreadcrumbItemElement>>;
+    bqClick: EventEmitter<BqBreadcrumbItemCustomEvent<HTMLBqBreadcrumbItemElement>>;
 }
 declare class BqButton {
     protected z: NgZone;
@@ -376,9 +376,9 @@ Details: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-target
    * The variant of button to apply on top of the appearance (applicable only to `appearance="primary"`) @default 'standard'
    */
     set variant(_: Components.BqButton['variant']);
-    bqBlur: EventEmitter<CustomEvent<HTMLBqButtonElement>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqButtonElement>>;
-    bqClick: EventEmitter<CustomEvent<HTMLBqButtonElement>>;
+    bqBlur: EventEmitter<BqButtonCustomEvent<HTMLBqButtonElement>>;
+    bqFocus: EventEmitter<BqButtonCustomEvent<HTMLBqButtonElement>>;
+    bqClick: EventEmitter<BqButtonCustomEvent<HTMLBqButtonElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqButton, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqButton, "bq-button", never, { "appearance": { "alias": "appearance"; "required": false; }; "block": { "alias": "block"; "required": false; }; "border": { "alias": "border"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "download": { "alias": "download"; "required": false; }; "href": { "alias": "href"; "required": false; }; "justifyContent": { "alias": "justifyContent"; "required": false; }; "label": { "alias": "label"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "onlyIcon": { "alias": "onlyIcon"; "required": false; }; "size": { "alias": "size"; "required": false; }; "target": { "alias": "target"; "required": false; }; "type": { "alias": "type"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; }, { "bqBlur": "bqBlur"; "bqFocus": "bqFocus"; "bqClick": "bqClick"; }, never, ["*"], false, never>;
@@ -387,15 +387,15 @@ declare interface BqButton extends Components.BqButton {
     /**
      * Handler to be called when the button loses focus.
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqButtonElement>>;
+    bqBlur: EventEmitter<BqButtonCustomEvent<HTMLBqButtonElement>>;
     /**
      * Handler to be called when the button gets focus.
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqButtonElement>>;
+    bqFocus: EventEmitter<BqButtonCustomEvent<HTMLBqButtonElement>>;
     /**
      * Handler to be called when the button is clicked.
      */
-    bqClick: EventEmitter<CustomEvent<HTMLBqButtonElement>>;
+    bqClick: EventEmitter<BqButtonCustomEvent<HTMLBqButtonElement>>;
 }
 declare class BqCard {
     protected z: NgZone;
@@ -453,11 +453,11 @@ declare class BqCheckbox {
    * A string representing the value of the checkbox. Primarily used to differentiate a list of related checkboxes that have the same name.
    */
     set value(_: Components.BqCheckbox['value']);
-    bqChange: EventEmitter<CustomEvent<{
+    bqChange: EventEmitter<BqCheckboxCustomEvent<{
         checked: boolean;
     }>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqCheckboxElement>>;
-    bqBlur: EventEmitter<CustomEvent<HTMLBqCheckboxElement>>;
+    bqFocus: EventEmitter<BqCheckboxCustomEvent<HTMLBqCheckboxElement>>;
+    bqBlur: EventEmitter<BqCheckboxCustomEvent<HTMLBqCheckboxElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqCheckbox, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqCheckbox, "bq-checkbox", never, { "backgroundOnHover": { "alias": "backgroundOnHover"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "formId": { "alias": "formId"; "required": false; }; "formValidationMessage": { "alias": "formValidationMessage"; "required": false; }; "indeterminate": { "alias": "indeterminate"; "required": false; }; "name": { "alias": "name"; "required": true; }; "required": { "alias": "required"; "required": false; }; "value": { "alias": "value"; "required": true; }; }, { "bqChange": "bqChange"; "bqFocus": "bqFocus"; "bqBlur": "bqBlur"; }, never, ["*"], false, never>;
@@ -466,88 +466,96 @@ declare interface BqCheckbox extends Components.BqCheckbox {
     /**
      * Handler to be called when the checkbox state changes
      */
-    bqChange: EventEmitter<CustomEvent<{
+    bqChange: EventEmitter<BqCheckboxCustomEvent<{
         checked: boolean;
     }>>;
     /**
      * Handler to be called when the checkbox gets focus
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqCheckboxElement>>;
+    bqFocus: EventEmitter<BqCheckboxCustomEvent<HTMLBqCheckboxElement>>;
     /**
      * Handler to be called when the checkbox loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqCheckboxElement>>;
+    bqBlur: EventEmitter<BqCheckboxCustomEvent<HTMLBqCheckboxElement>>;
 }
 declare class BqDatePicker {
     protected z: NgZone;
     protected el: HTMLBqDatePickerElement;
     /**
-   * If `true`, the Date picker input will be focused on component render
+   * If `true`, the Date picker input will be focused on component render. @default false
    */
     set autofocus(_: Components.BqDatePicker['autofocus']);
     /**
-   * The clear button aria label @default 'Clear value'
+   * The clear button aria label. @default 'Clear value'
    */
     set clearButtonLabel(_: Components.BqDatePicker['clearButtonLabel']);
     /**
-   * If `true`, the clear button won't be displayed @default false
+   * The aria-label for the calendar trigger button. @default 'Open calendar'
+   */
+    set calendarButtonLabel(_: Components.BqDatePicker['calendarButtonLabel']);
+    /**
+   * If `true`, the clear button won't be displayed. @default false
    */
     set disableClear(_: Components.BqDatePicker['disableClear']);
     /**
-   * Indicates whether the Date picker input is disabled or not.
-If `true`, the Date picker is disabled and cannot be interacted with. @default false
+   * Indicates whether the Date picker input is disabled or not. @default false
    */
     set disabled(_: Components.BqDatePicker['disabled']);
     /**
-   * Represents the distance (gutter or margin) between the Date picker panel and the input element. @default 8
+   * Distance (gutter) between the Date picker panel and the input element. @default 8
    */
     set distance(_: Components.BqDatePicker['distance']);
     /**
-   * The first day of the week, where Sunday is 0, Monday is 1, etc @default 1
+   * The first day of the week, where Sunday is 0, Monday is 1, etc. @default 1
    */
     set firstDayOfWeek(_: Components.BqDatePicker['firstDayOfWeek']);
     /**
-   * The options to use when formatting the displayed value.
-Details: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat#using_options @default {
-    day: 'numeric',
-    month: 'short',
-    year: 'numeric',
-  }
+   * Options used when formatting the displayed value.
+
+When omitted, sensible defaults are picked based on `precision`:
+- `day`   → `{ day: 'numeric', month: 'short', year: 'numeric' }`
+- `month` → `{ month: 'long', year: 'numeric' }`
+- `year`  → `{ year: 'numeric' }`
    */
     set formatOptions(_: Components.BqDatePicker['formatOptions']);
     /**
-   * The ID of the form that the Date picker input belongs to.
+   * The ID of the form the input belongs to.
    */
     set form(_: Components.BqDatePicker['form']);
     /**
-   * The native form validation message (mandatory if `required` is set)
+   * Native form validation message (mandatory if `required` is set).
    */
     set formValidationMessage(_: Components.BqDatePicker['formValidationMessage']);
     /**
-   * A function that takes a date and returns true if the date should not be selectable
+   * The view opened first when the panel becomes visible. @default 'days'
+   */
+    set initialView(_: Components.BqDatePicker['initialView']);
+    /**
+   * Predicate that marks specific dates as unselectable.
    */
     set isDateDisallowed(_: Components.BqDatePicker['isDateDisallowed']);
     /**
-   * The locale for formatting dates. If not set, will use the browser's locale.
-Details: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#locales_argument @default 'en-GB'
+   * Locale used for formatting dates. @default 'en-GB'
    */
     set locale(_: Components.BqDatePicker['locale']);
     /**
-   * The latest date that can be selected
+   * Latest date that can be selected (ISO).
    */
     set max(_: Components.BqDatePicker['max']);
     /**
-   * The earliest date that can be selected
+   * Earliest date that can be selected (ISO).
    */
     set min(_: Components.BqDatePicker['min']);
     /**
-   * Number of months to show when range is `true`
+   * Number of months to show side by side (range / multi). Capped at 2.
+Larger values are silently clamped to keep the popover from overflowing
+the viewport and to preserve keyboard navigation semantics. @default 1
    */
     set months(_: Components.BqDatePicker['months']);
     /**
-   * Specifies how the next/previous buttons should navigate the calendar.
-- single: The buttons will navigate by a single month at a time.
-- months: The buttons will navigate by the number of months displayed per view. @default 'single'
+   * How the next/previous buttons should navigate the calendar.
+- single: navigate one month at a time.
+- months: navigate by the number of months displayed. @default 'single'
    */
     set monthsPerView(_: Components.BqDatePicker['monthsPerView']);
     /**
@@ -555,90 +563,114 @@ Details: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Globa
    */
     set name(_: Components.BqDatePicker['name']);
     /**
-   * If `true`, the Date picker panel will be visible. @default false
+   * If `true`, the panel is visible. @default false
    */
     set open(_: Components.BqDatePicker['open']);
     /**
-   * When set, it will override the height of the Date picker panel. @default 'auto'
+   * Overrides the height of the Date picker panel. @default 'auto'
    */
     set panelHeight(_: Components.BqDatePicker['panelHeight']);
     /**
-   * The Date picker input placeholder text value
+   * Placeholder text shown when no value is selected.
    */
     set placeholder(_: Components.BqDatePicker['placeholder']);
     /**
-   * Position of the Date picker panel @default 'bottom-end'
+   * Position of the Date picker panel. @default 'bottom-end'
    */
     set placement(_: Components.BqDatePicker['placement']);
     /**
-   * Indicates whether or not the Date picker input is required to be filled out before submitting the form.
+   * Precision of the value produced by the picker.
+
+- `day`   → `YYYY-MM-DD` (default). Standard drill-down.
+- `month` → `YYYY-MM`. Selection commits on the months view; no days view.
+- `year`  → `YYYY`. Selection commits on the years view; no months/days view.
+
+When precision is coarser than day, `initialView` is forced to match and
+the header title cycles through the views available for that precision. @default 'day'
+   */
+    set precision(_: Components.BqDatePicker['precision']);
+    /**
+   * Whether a value must be selected before submitting the form. @default false
    */
     set required(_: Components.BqDatePicker['required']);
     /**
-   * Represents the skidding between the Date picker panel and the input element. @default 0
+   * Skidding between the panel and the input element. @default 0
    */
     set skidding(_: Components.BqDatePicker['skidding']);
     /**
-   * Whether to show days outside the month @default false
+   * Whether to render days outside the current month. @default false
    */
     set showOutsideDays(_: Components.BqDatePicker['showOutsideDays']);
     /**
-   * Defines the strategy to position the Date picker panel @default 'fixed'
+   * Positioning strategy for the panel. @default 'fixed'
    */
     set strategy(_: Components.BqDatePicker['strategy']);
     /**
-   * The date that is tentatively selected e.g. the start of a range selection
-   */
-    set tentative(_: Components.BqDatePicker['tentative']);
-    /**
-   * It defines how the calendar will behave, allowing single date selection, range selection, or multiple date selection @default 'single'
+   * Selection type.
+- `single`: single date.
+- `multi`: multiple discrete dates.
+- `range`: contiguous range. @default 'single'
    */
     set type(_: Components.BqDatePicker['type']);
     /**
-   * The validation status of the Select input. @remarks This property is used to indicate the validation status of the select input. It can be set to one of the following values:
-- `'none'`: No validation status is set.
-- `'error'`: The input has a validation error.
-- `'warning'`: The input has a validation warning.
-- `'success'`: The input has passed validation.,@default 'none'
+   * Validation state applied to the input. @default 'none'
    */
     set validationStatus(_: Components.BqDatePicker['validationStatus']);
     /**
-   * The select input value represents the currently selected date or range and can be used to reset the field to a previous value.
-All dates are expected in ISO-8601 format (YYYY-MM-DD).
+   * Currently selected value, in the precision-aware wire format:
+- `precision="day"`   → tokens are `YYYY-MM-DD`
+- `precision="month"` → tokens are `YYYY-MM`
+- `precision="year"`  → tokens are `YYYY`
+
+How multiple tokens are combined depends on `type`:
+- `single` → a single token (e.g. `"2025-05-15"`, `"2025-05"`, `"2025"`)
+- `range`  → `"start/end"` — two tokens joined with `/`
+- `multi`  → space-separated tokens (e.g. `"2025-05-15 2025-05-20"`)
    */
     set value(_: Components.BqDatePicker['value']);
-    bqBlur: EventEmitter<CustomEvent<HTMLBqDatePickerElement>>;
-    bqChange: EventEmitter<CustomEvent<{
-        value: string;
+    bqBlur: EventEmitter<BqDatePickerCustomEvent<HTMLBqDatePickerElement>>;
+    bqChange: EventEmitter<BqDatePickerCustomEvent<{
+        value: string | undefined;
+        el: HTMLBqDatePickerElement;
+    }>>;
+    bqClear: EventEmitter<BqDatePickerCustomEvent<HTMLBqDatePickerElement>>;
+    bqFocus: EventEmitter<BqDatePickerCustomEvent<HTMLBqDatePickerElement>>;
+    bqViewChange: EventEmitter<BqDatePickerCustomEvent<{
+        view: TCalendarView;
         el: HTMLBqDatePickerElement;
     }>>;
-    bqClear: EventEmitter<CustomEvent<HTMLBqDatePickerElement>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqDatePickerElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqDatePicker, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<BqDatePicker, "bq-date-picker", never, { "autofocus": { "alias": "autofocus"; "required": false; }; "clearButtonLabel": { "alias": "clearButtonLabel"; "required": false; }; "disableClear": { "alias": "disableClear"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "distance": { "alias": "distance"; "required": false; }; "firstDayOfWeek": { "alias": "firstDayOfWeek"; "required": false; }; "form": { "alias": "form"; "required": false; }; "formValidationMessage": { "alias": "formValidationMessage"; "required": false; }; "formatOptions": { "alias": "formatOptions"; "required": false; }; "isDateDisallowed": { "alias": "isDateDisallowed"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "max": { "alias": "max"; "required": false; }; "min": { "alias": "min"; "required": false; }; "months": { "alias": "months"; "required": false; }; "monthsPerView": { "alias": "monthsPerView"; "required": false; }; "name": { "alias": "name"; "required": true; }; "open": { "alias": "open"; "required": false; }; "panelHeight": { "alias": "panelHeight"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "required": { "alias": "required"; "required": false; }; "showOutsideDays": { "alias": "showOutsideDays"; "required": false; }; "skidding": { "alias": "skidding"; "required": false; }; "strategy": { "alias": "strategy"; "required": false; }; "tentative": { "alias": "tentative"; "required": false; }; "type": { "alias": "type"; "required": false; }; "validationStatus": { "alias": "validationStatus"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "bqBlur": "bqBlur"; "bqChange": "bqChange"; "bqClear": "bqClear"; "bqFocus": "bqFocus"; }, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BqDatePicker, "bq-date-picker", never, { "autofocus": { "alias": "autofocus"; "required": false; }; "calendarButtonLabel": { "alias": "calendarButtonLabel"; "required": false; }; "clearButtonLabel": { "alias": "clearButtonLabel"; "required": false; }; "disableClear": { "alias": "disableClear"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "distance": { "alias": "distance"; "required": false; }; "firstDayOfWeek": { "alias": "firstDayOfWeek"; "required": false; }; "form": { "alias": "form"; "required": false; }; "formValidationMessage": { "alias": "formValidationMessage"; "required": false; }; "formatOptions": { "alias": "formatOptions"; "required": false; }; "initialView": { "alias": "initialView"; "required": false; }; "isDateDisallowed": { "alias": "isDateDisallowed"; "required": false; }; "locale": { "alias": "locale"; "required": false; }; "max": { "alias": "max"; "required": false; }; "min": { "alias": "min"; "required": false; }; "months": { "alias": "months"; "required": false; }; "monthsPerView": { "alias": "monthsPerView"; "required": false; }; "name": { "alias": "name"; "required": true; }; "open": { "alias": "open"; "required": false; }; "panelHeight": { "alias": "panelHeight"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "precision": { "alias": "precision"; "required": false; }; "required": { "alias": "required"; "required": false; }; "showOutsideDays": { "alias": "showOutsideDays"; "required": false; }; "skidding": { "alias": "skidding"; "required": false; }; "strategy": { "alias": "strategy"; "required": false; }; "type": { "alias": "type"; "required": false; }; "validationStatus": { "alias": "validationStatus"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "bqBlur": "bqBlur"; "bqChange": "bqChange"; "bqClear": "bqClear"; "bqFocus": "bqFocus"; "bqViewChange": "bqViewChange"; }, never, ["*"], false, never>;
 }
 declare interface BqDatePicker extends Components.BqDatePicker {
     /**
-     * Callback handler emitted when the input loses focus
+     * Callback handler emitted when the input loses focus.
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqDatePickerElement>>;
+    bqBlur: EventEmitter<BqDatePickerCustomEvent<HTMLBqDatePickerElement>>;
     /**
-     * Callback handler emitted when the input value has changed and the input loses focus.
-  This handler is called whenever the user finishes typing or pasting text into the input field and then clicks outside of the input field.
+     * Callback handler emitted when the input value changes.
      */
-    bqChange: EventEmitter<CustomEvent<{
-        value: string;
+    bqChange: EventEmitter<BqDatePickerCustomEvent<{
+        value: string | undefined;
         el: HTMLBqDatePickerElement;
     }>>;
     /**
-     * Callback handler emitted when the input value has been cleared
+     * Callback handler emitted when the value is cleared.
      */
-    bqClear: EventEmitter<CustomEvent<HTMLBqDatePickerElement>>;
+    bqClear: EventEmitter<BqDatePickerCustomEvent<HTMLBqDatePickerElement>>;
     /**
-     * Callback handler emitted when the input has received focus
+     * Callback handler emitted when the input receives focus.
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqDatePickerElement>>;
+    bqFocus: EventEmitter<BqDatePickerCustomEvent<HTMLBqDatePickerElement>>;
+    /**
+     * Callback handler emitted when the internal calendar view changes
+  (e.g. from `days` to `months`, or from `years` back to `days`).
+     */
+    bqViewChange: EventEmitter<BqDatePickerCustomEvent<{
+        view: TCalendarView;
+        el: HTMLBqDatePickerElement;
+    }>>;
 }
 declare class BqDialog {
     protected z: NgZone;
@@ -675,11 +707,11 @@ declare class BqDialog {
    * The size of the dialog @default 'medium'
    */
     set size(_: Components.BqDialog['size']);
-    bqCancel: EventEmitter<CustomEvent<void>>;
-    bqClose: EventEmitter<CustomEvent<void>>;
-    bqOpen: EventEmitter<CustomEvent<void>>;
-    bqAfterOpen: EventEmitter<CustomEvent<void>>;
-    bqAfterClose: EventEmitter<CustomEvent<void>>;
+    bqCancel: EventEmitter<BqDialogCustomEvent<void>>;
+    bqClose: EventEmitter<BqDialogCustomEvent<void>>;
+    bqOpen: EventEmitter<BqDialogCustomEvent<void>>;
+    bqAfterOpen: EventEmitter<BqDialogCustomEvent<void>>;
+    bqAfterClose: EventEmitter<BqDialogCustomEvent<void>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqDialog, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqDialog, "bq-dialog", never, { "border": { "alias": "border"; "required": false; }; "disableBackdrop": { "alias": "disableBackdrop"; "required": false; }; "disableCloseClickOutside": { "alias": "disableCloseClickOutside"; "required": false; }; "disableCloseEscKeydown": { "alias": "disableCloseEscKeydown"; "required": false; }; "footerAppearance": { "alias": "footerAppearance"; "required": false; }; "hideCloseButton": { "alias": "hideCloseButton"; "required": false; }; "open": { "alias": "open"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "bqCancel": "bqCancel"; "bqClose": "bqClose"; "bqOpen": "bqOpen"; "bqAfterOpen": "bqAfterOpen"; "bqAfterClose": "bqAfterClose"; }, never, ["*"], false, never>;
@@ -688,23 +720,23 @@ declare interface BqDialog extends Components.BqDialog {
     /**
      * Callback handler emitted when the dialog has been canceled or dismissed
      */
-    bqCancel: EventEmitter<CustomEvent<void>>;
+    bqCancel: EventEmitter<BqDialogCustomEvent<void>>;
     /**
      * Callback handler emitted when the dialog will close
      */
-    bqClose: EventEmitter<CustomEvent<void>>;
+    bqClose: EventEmitter<BqDialogCustomEvent<void>>;
     /**
      * Callback handler emitted when the dialog will open
      */
-    bqOpen: EventEmitter<CustomEvent<void>>;
+    bqOpen: EventEmitter<BqDialogCustomEvent<void>>;
     /**
      * Callback handler emitted when the dialog finish opening
      */
-    bqAfterOpen: EventEmitter<CustomEvent<void>>;
+    bqAfterOpen: EventEmitter<BqDialogCustomEvent<void>>;
     /**
      * Callback handler emitted when the dialog finish closing
      */
-    bqAfterClose: EventEmitter<CustomEvent<void>>;
+    bqAfterClose: EventEmitter<BqDialogCustomEvent<void>>;
 }
 declare class BqDivider {
     protected z: NgZone;
@@ -778,10 +810,10 @@ declare class BqDrawer {
    * Defines the position of the drawer @default 'end'
    */
     set position(_: Components.BqDrawer['position']);
-    bqClose: EventEmitter<CustomEvent<any>>;
-    bqOpen: EventEmitter<CustomEvent<any>>;
-    bqAfterOpen: EventEmitter<CustomEvent<any>>;
-    bqAfterClose: EventEmitter<CustomEvent<any>>;
+    bqClose: EventEmitter<BqDrawerCustomEvent<any>>;
+    bqOpen: EventEmitter<BqDrawerCustomEvent<any>>;
+    bqAfterOpen: EventEmitter<BqDrawerCustomEvent<any>>;
+    bqAfterClose: EventEmitter<BqDrawerCustomEvent<any>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqDrawer, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqDrawer, "bq-drawer", never, { "closeOnClickOutside": { "alias": "closeOnClickOutside"; "required": false; }; "closeOnEsc": { "alias": "closeOnEsc"; "required": false; }; "enableBackdrop": { "alias": "enableBackdrop"; "required": false; }; "open": { "alias": "open"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "position": { "alias": "position"; "required": false; }; }, { "bqClose": "bqClose"; "bqOpen": "bqOpen"; "bqAfterOpen": "bqAfterOpen"; "bqAfterClose": "bqAfterClose"; }, never, ["*"], false, never>;
@@ -790,19 +822,19 @@ declare interface BqDrawer extends Components.BqDrawer {
     /**
      * Callback handler to be called when the drawer is closed
      */
-    bqClose: EventEmitter<CustomEvent<any>>;
+    bqClose: EventEmitter<BqDrawerCustomEvent<any>>;
     /**
      * Callback handler to be called when the drawer is opened
      */
-    bqOpen: EventEmitter<CustomEvent<any>>;
+    bqOpen: EventEmitter<BqDrawerCustomEvent<any>>;
     /**
      * Callback handler to be called after the drawer has been opened
      */
-    bqAfterOpen: EventEmitter<CustomEvent<any>>;
+    bqAfterOpen: EventEmitter<BqDrawerCustomEvent<any>>;
     /**
      * Callback handler to be called after the drawer has been closed
      */
-    bqAfterClose: EventEmitter<CustomEvent<any>>;
+    bqAfterClose: EventEmitter<BqDrawerCustomEvent<any>>;
 }
 declare class BqDropdown {
     protected z: NgZone;
@@ -847,7 +879,7 @@ declare class BqDropdown {
    * Defines the strategy to position the panel @default 'fixed'
    */
     set strategy(_: Components.BqDropdown['strategy']);
-    bqOpen: EventEmitter<CustomEvent<{
+    bqOpen: EventEmitter<BqDropdownCustomEvent<{
         open: boolean;
     }>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
@@ -858,7 +890,7 @@ declare interface BqDropdown extends Components.BqDropdown {
     /**
      * Callback handler to be called when the dropdown panel is opened or closed.
      */
-    bqOpen: EventEmitter<CustomEvent<{
+    bqOpen: EventEmitter<BqDropdownCustomEvent<{
         open: boolean;
     }>>;
 }
@@ -902,7 +934,7 @@ declare class BqIcon {
    *  @deprecated It set the icon weight/style,@default undefined
    */
     set weight(_: Components.BqIcon['weight']);
-    svgLoaded: EventEmitter<CustomEvent<any>>;
+    svgLoaded: EventEmitter<BqIconCustomEvent<any>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqIcon, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqIcon, "bq-icon", never, { "color": { "alias": "color"; "required": false; }; "label": { "alias": "label"; "required": false; }; "name": { "alias": "name"; "required": false; }; "size": { "alias": "size"; "required": false; }; "src": { "alias": "src"; "required": false; }; "weight": { "alias": "weight"; "required": false; }; }, { "svgLoaded": "svgLoaded"; }, never, ["*"], false, never>;
@@ -911,7 +943,7 @@ declare interface BqIcon extends Components.BqIcon {
     /**
      * Callback handler to be called when the SVG has loaded
      */
-    svgLoaded: EventEmitter<CustomEvent<any>>;
+    svgLoaded: EventEmitter<BqIconCustomEvent<any>>;
 }
 declare class BqInput {
     protected z: NgZone;
@@ -1021,14 +1053,14 @@ Possible values are 'text', 'password', 'email', 'number', 'tel', 'search', 'url
    * The input value, it can be used to reset the input to a previous value
    */
     set value(_: Components.BqInput['value']);
-    bqBlur: EventEmitter<CustomEvent<HTMLBqInputElement>>;
-    bqChange: EventEmitter<CustomEvent<{
+    bqBlur: EventEmitter<BqInputCustomEvent<HTMLBqInputElement>>;
+    bqChange: EventEmitter<BqInputCustomEvent<{
         value: string | number | string[];
         el: HTMLBqInputElement;
     }>>;
-    bqClear: EventEmitter<CustomEvent<HTMLBqInputElement>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqInputElement>>;
-    bqInput: EventEmitter<CustomEvent<{
+    bqClear: EventEmitter<BqInputCustomEvent<HTMLBqInputElement>>;
+    bqFocus: EventEmitter<BqInputCustomEvent<HTMLBqInputElement>>;
+    bqInput: EventEmitter<BqInputCustomEvent<{
         value: string | number | string[];
         el: HTMLBqInputElement;
     }>>;
@@ -1040,28 +1072,28 @@ declare interface BqInput extends Components.BqInput {
     /**
      * Callback handler emitted when the input loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqInputElement>>;
+    bqBlur: EventEmitter<BqInputCustomEvent<HTMLBqInputElement>>;
     /**
      * Callback handler emitted when the input value has changed and the input loses focus.
   This handler is called whenever the user finishes typing or pasting text into the input field and then clicks outside of the input field.
      */
-    bqChange: EventEmitter<CustomEvent<{
+    bqChange: EventEmitter<BqInputCustomEvent<{
         value: string | number | string[];
         el: HTMLBqInputElement;
     }>>;
     /**
      * Callback handler emitted when the input value has been cleared
      */
-    bqClear: EventEmitter<CustomEvent<HTMLBqInputElement>>;
+    bqClear: EventEmitter<BqInputCustomEvent<HTMLBqInputElement>>;
     /**
      * Callback handler emitted when the input has received focus
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqInputElement>>;
+    bqFocus: EventEmitter<BqInputCustomEvent<HTMLBqInputElement>>;
     /**
      * Callback handler emitted when the input value changes.
   This handler is called whenever the user types or pastes text into the input field.
      */
-    bqInput: EventEmitter<CustomEvent<{
+    bqInput: EventEmitter<BqInputCustomEvent<{
         value: string | number | string[];
         el: HTMLBqInputElement;
     }>>;
@@ -1097,10 +1129,10 @@ declare class BqNotification {
    * Type of Notification @default 'info'
    */
     set type(_: Components.BqNotification['type']);
-    bqHide: EventEmitter<CustomEvent<any>>;
-    bqShow: EventEmitter<CustomEvent<any>>;
-    bqAfterOpen: EventEmitter<CustomEvent<any>>;
-    bqAfterClose: EventEmitter<CustomEvent<any>>;
+    bqHide: EventEmitter<BqNotificationCustomEvent<any>>;
+    bqShow: EventEmitter<BqNotificationCustomEvent<any>>;
+    bqAfterOpen: EventEmitter<BqNotificationCustomEvent<any>>;
+    bqAfterClose: EventEmitter<BqNotificationCustomEvent<any>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqNotification, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqNotification, "bq-notification", never, { "autoDismiss": { "alias": "autoDismiss"; "required": false; }; "border": { "alias": "border"; "required": false; }; "disableClose": { "alias": "disableClose"; "required": false; }; "hideIcon": { "alias": "hideIcon"; "required": false; }; "open": { "alias": "open"; "required": false; }; "time": { "alias": "time"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, { "bqHide": "bqHide"; "bqShow": "bqShow"; "bqAfterOpen": "bqAfterOpen"; "bqAfterClose": "bqAfterClose"; }, never, ["*"], false, never>;
@@ -1109,19 +1141,19 @@ declare interface BqNotification extends Components.BqNotification {
     /**
      * Callback handler to be called when the notification is hidden
      */
-    bqHide: EventEmitter<CustomEvent<any>>;
+    bqHide: EventEmitter<BqNotificationCustomEvent<any>>;
     /**
      * Callback handler to be called when the notification is shown
      */
-    bqShow: EventEmitter<CustomEvent<any>>;
+    bqShow: EventEmitter<BqNotificationCustomEvent<any>>;
     /**
      * Callback handler to be called after the notification has been opened
      */
-    bqAfterOpen: EventEmitter<CustomEvent<any>>;
+    bqAfterOpen: EventEmitter<BqNotificationCustomEvent<any>>;
     /**
      * Callback handler to be called after the notification has been closed
      */
-    bqAfterClose: EventEmitter<CustomEvent<any>>;
+    bqAfterClose: EventEmitter<BqNotificationCustomEvent<any>>;
 }
 declare class BqOption {
     protected z: NgZone;
@@ -1146,10 +1178,10 @@ declare class BqOption {
    * A string representing the value of the option. Can be used to identify the item
    */
     set value(_: Components.BqOption['value']);
-    bqBlur: EventEmitter<CustomEvent<HTMLBqOptionElement>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqOptionElement>>;
-    bqClick: EventEmitter<CustomEvent<HTMLBqOptionElement>>;
-    bqEnter: EventEmitter<CustomEvent<HTMLBqOptionElement>>;
+    bqBlur: EventEmitter<BqOptionCustomEvent<HTMLBqOptionElement>>;
+    bqFocus: EventEmitter<BqOptionCustomEvent<HTMLBqOptionElement>>;
+    bqClick: EventEmitter<BqOptionCustomEvent<HTMLBqOptionElement>>;
+    bqEnter: EventEmitter<BqOptionCustomEvent<HTMLBqOptionElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqOption, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqOption, "bq-option", never, { "disabled": { "alias": "disabled"; "required": false; }; "displayValue": { "alias": "displayValue"; "required": false; }; "hidden": { "alias": "hidden"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "bqBlur": "bqBlur"; "bqFocus": "bqFocus"; "bqClick": "bqClick"; "bqEnter": "bqEnter"; }, never, ["*"], false, never>;
@@ -1158,19 +1190,19 @@ declare interface BqOption extends Components.BqOption {
     /**
      * Handler to be called when item loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqOptionElement>>;
+    bqBlur: EventEmitter<BqOptionCustomEvent<HTMLBqOptionElement>>;
     /**
      * Handler to be called when item is focused
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqOptionElement>>;
+    bqFocus: EventEmitter<BqOptionCustomEvent<HTMLBqOptionElement>>;
     /**
      * Handler to be called when item is clicked
      */
-    bqClick: EventEmitter<CustomEvent<HTMLBqOptionElement>>;
+    bqClick: EventEmitter<BqOptionCustomEvent<HTMLBqOptionElement>>;
     /**
      * Handler to be called on enter key press
      */
-    bqEnter: EventEmitter<CustomEvent<HTMLBqOptionElement>>;
+    bqEnter: EventEmitter<BqOptionCustomEvent<HTMLBqOptionElement>>;
 }
 declare class BqOptionGroup {
     protected z: NgZone;
@@ -1188,7 +1220,7 @@ declare class BqOptionList {
    * Aria label for the list. @default 'Options'
    */
     set ariaLabel(_: Components.BqOptionList['ariaLabel']);
-    bqSelect: EventEmitter<CustomEvent<{
+    bqSelect: EventEmitter<BqOptionListCustomEvent<{
         value: string;
         item: HTMLBqOptionElement;
     }>>;
@@ -1200,7 +1232,7 @@ declare interface BqOptionList extends Components.BqOptionList {
     /**
      * Handler to be called when `bq-option` is selected (on click/enter press).
      */
-    bqSelect: EventEmitter<CustomEvent<{
+    bqSelect: EventEmitter<BqOptionListCustomEvent<{
         value: string;
         item: HTMLBqOptionElement;
     }>>;
@@ -1319,13 +1351,13 @@ declare class BqRadio {
    * A string representing the value of the radio.
    */
     set value(_: Components.BqRadio['value']);
-    bqClick: EventEmitter<CustomEvent<{
+    bqClick: EventEmitter<BqRadioCustomEvent<{
         value: string;
         target: HTMLBqRadioElement;
     }>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqRadioElement>>;
-    bqBlur: EventEmitter<CustomEvent<HTMLBqRadioElement>>;
-    bqKeyDown: EventEmitter<CustomEvent<{
+    bqFocus: EventEmitter<BqRadioCustomEvent<HTMLBqRadioElement>>;
+    bqBlur: EventEmitter<BqRadioCustomEvent<HTMLBqRadioElement>>;
+    bqKeyDown: EventEmitter<BqRadioCustomEvent<{
         key: string;
         target: HTMLBqRadioElement;
     }>>;
@@ -1337,22 +1369,22 @@ declare interface BqRadio extends Components.BqRadio {
     /**
      * Handler to be called when the radio state changes
      */
-    bqClick: EventEmitter<CustomEvent<{
+    bqClick: EventEmitter<BqRadioCustomEvent<{
         value: string;
         target: HTMLBqRadioElement;
     }>>;
     /**
      * Handler to be called when the radio gets focus
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqRadioElement>>;
+    bqFocus: EventEmitter<BqRadioCustomEvent<HTMLBqRadioElement>>;
     /**
      * Handler to be called when the radio loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqRadioElement>>;
+    bqBlur: EventEmitter<BqRadioCustomEvent<HTMLBqRadioElement>>;
     /**
      * Handler to be called when the radio key is pressed
      */
-    bqKeyDown: EventEmitter<CustomEvent<{
+    bqKeyDown: EventEmitter<BqRadioCustomEvent<{
         key: string;
         target: HTMLBqRadioElement;
     }>>;
@@ -1396,11 +1428,11 @@ declare class BqRadioGroup {
    * A string representing the value of the radio.
    */
     set value(_: Components.BqRadioGroup['value']);
-    bqChange: EventEmitter<CustomEvent<{
+    bqChange: EventEmitter<BqRadioGroupCustomEvent<{
         value: string;
         target: HTMLBqRadioElement;
     }>>;
-    bqBlur: EventEmitter<CustomEvent<HTMLBqRadioElement>>;
+    bqBlur: EventEmitter<BqRadioGroupCustomEvent<HTMLBqRadioElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqRadioGroup, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqRadioGroup, "bq-radio-group", never, { "backgroundOnHover": { "alias": "backgroundOnHover"; "required": false; }; "debounceTime": { "alias": "debounceTime"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "fieldset": { "alias": "fieldset"; "required": false; }; "name": { "alias": "name"; "required": true; }; "orientation": { "alias": "orientation"; "required": false; }; "required": { "alias": "required"; "required": false; }; "requiredValidationMessage": { "alias": "requiredValidationMessage"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "bqChange": "bqChange"; "bqBlur": "bqBlur"; }, never, ["*"], false, never>;
@@ -1409,14 +1441,14 @@ declare interface BqRadioGroup extends Components.BqRadioGroup {
     /**
      * Handler to be called when the radio state changes
      */
-    bqChange: EventEmitter<CustomEvent<{
+    bqChange: EventEmitter<BqRadioGroupCustomEvent<{
         value: string;
         target: HTMLBqRadioElement;
     }>>;
     /**
      * Handler to be called when the radio loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqRadioElement>>;
+    bqBlur: EventEmitter<BqRadioGroupCustomEvent<HTMLBqRadioElement>>;
 }
 declare class BqSelect {
     protected z: NgZone;
@@ -1456,6 +1488,10 @@ If `true`, the Select is disabled and cannot be interacted with. @default false
    */
     set form(_: Components.BqSelect['form']);
     /**
+   * The native form validation message (mandatory if `required` is set)
+   */
+    set formValidationMessage(_: Components.BqSelect['formValidationMessage']);
+    /**
    * If true, the Select panel will remain open after a selection is made. @default false
    */
     set keepOpenOnSelect(_: Components.BqSelect['keepOpenOnSelect']);
@@ -1519,44 +1555,44 @@ If `true`, the Select is disabled and cannot be interacted with. @default false
    * The select input value, it can be used to reset the field to a previous value
    */
     set value(_: Components.BqSelect['value']);
-    bqBlur: EventEmitter<CustomEvent<HTMLBqSelectElement>>;
-    bqClear: EventEmitter<CustomEvent<HTMLBqSelectElement>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqSelectElement>>;
-    bqSelect: EventEmitter<CustomEvent<{
+    bqBlur: EventEmitter<BqSelectCustomEvent<HTMLBqSelectElement>>;
+    bqClear: EventEmitter<BqSelectCustomEvent<HTMLBqSelectElement>>;
+    bqFocus: EventEmitter<BqSelectCustomEvent<HTMLBqSelectElement>>;
+    bqSelect: EventEmitter<BqSelectCustomEvent<{
         value: string | number | string[];
         item: HTMLBqOptionElement;
     }>>;
-    bqInput: EventEmitter<CustomEvent<{
+    bqInput: EventEmitter<BqSelectCustomEvent<{
         value: string | number | string[];
     }>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqSelect, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<BqSelect, "bq-select", never, { "autofocus": { "alias": "autofocus"; "required": false; }; "clearButtonLabel": { "alias": "clearButtonLabel"; "required": false; }; "debounceTime": { "alias": "debounceTime"; "required": false; }; "disableClear": { "alias": "disableClear"; "required": false; }; "disableScrollLock": { "alias": "disableScrollLock"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "distance": { "alias": "distance"; "required": false; }; "form": { "alias": "form"; "required": false; }; "keepOpenOnSelect": { "alias": "keepOpenOnSelect"; "required": false; }; "maxTagsVisible": { "alias": "maxTagsVisible"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "name": { "alias": "name"; "required": true; }; "open": { "alias": "open"; "required": false; }; "panelHeight": { "alias": "panelHeight"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "required": { "alias": "required"; "required": false; }; "sameWidth": { "alias": "sameWidth"; "required": false; }; "skidding": { "alias": "skidding"; "required": false; }; "strategy": { "alias": "strategy"; "required": false; }; "validationStatus": { "alias": "validationStatus"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "bqBlur": "bqBlur"; "bqClear": "bqClear"; "bqFocus": "bqFocus"; "bqSelect": "bqSelect"; "bqInput": "bqInput"; }, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<BqSelect, "bq-select", never, { "autofocus": { "alias": "autofocus"; "required": false; }; "clearButtonLabel": { "alias": "clearButtonLabel"; "required": false; }; "debounceTime": { "alias": "debounceTime"; "required": false; }; "disableClear": { "alias": "disableClear"; "required": false; }; "disableScrollLock": { "alias": "disableScrollLock"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "distance": { "alias": "distance"; "required": false; }; "form": { "alias": "form"; "required": false; }; "formValidationMessage": { "alias": "formValidationMessage"; "required": false; }; "keepOpenOnSelect": { "alias": "keepOpenOnSelect"; "required": false; }; "maxTagsVisible": { "alias": "maxTagsVisible"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "name": { "alias": "name"; "required": true; }; "open": { "alias": "open"; "required": false; }; "panelHeight": { "alias": "panelHeight"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "required": { "alias": "required"; "required": false; }; "sameWidth": { "alias": "sameWidth"; "required": false; }; "skidding": { "alias": "skidding"; "required": false; }; "strategy": { "alias": "strategy"; "required": false; }; "validationStatus": { "alias": "validationStatus"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "bqBlur": "bqBlur"; "bqClear": "bqClear"; "bqFocus": "bqFocus"; "bqSelect": "bqSelect"; "bqInput": "bqInput"; }, never, ["*"], false, never>;
 }
 declare interface BqSelect extends Components.BqSelect {
     /**
      * Callback handler emitted when the Select input loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqSelectElement>>;
+    bqBlur: EventEmitter<BqSelectCustomEvent<HTMLBqSelectElement>>;
     /**
      * Callback handler emitted when the selected value has been cleared
      */
-    bqClear: EventEmitter<CustomEvent<HTMLBqSelectElement>>;
+    bqClear: EventEmitter<BqSelectCustomEvent<HTMLBqSelectElement>>;
     /**
      * Callback handler emitted when the Select input has received focus
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqSelectElement>>;
+    bqFocus: EventEmitter<BqSelectCustomEvent<HTMLBqSelectElement>>;
     /**
      * Callback handler emitted when the selected value has changed
      */
-    bqSelect: EventEmitter<CustomEvent<{
+    bqSelect: EventEmitter<BqSelectCustomEvent<{
         value: string | number | string[];
         item: HTMLBqOptionElement;
     }>>;
     /**
      * Callback handler emitted when the Select input changes its value while typing
      */
-    bqInput: EventEmitter<CustomEvent<{
+    bqInput: EventEmitter<BqSelectCustomEvent<{
         value: string | number | string[];
     }>>;
 }
@@ -1575,10 +1611,10 @@ declare class BqSideMenu {
    * It sets the size of the navigation menu items @default 'medium'
    */
     set size(_: Components.BqSideMenu['size']);
-    bqCollapse: EventEmitter<CustomEvent<{
+    bqCollapse: EventEmitter<BqSideMenuCustomEvent<{
         collapse: boolean;
     }>>;
-    bqSelect: EventEmitter<CustomEvent<HTMLBqSideMenuItemElement>>;
+    bqSelect: EventEmitter<BqSideMenuCustomEvent<HTMLBqSideMenuItemElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqSideMenu, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqSideMenu, "bq-side-menu", never, { "appearance": { "alias": "appearance"; "required": false; }; "collapse": { "alias": "collapse"; "required": false; }; "size": { "alias": "size"; "required": false; }; }, { "bqCollapse": "bqCollapse"; "bqSelect": "bqSelect"; }, never, ["*"], false, never>;
@@ -1587,13 +1623,13 @@ declare interface BqSideMenu extends Components.BqSideMenu {
     /**
      * Callback handler to be called when the Side menu changes its width from expanded to collapse and vice versa
      */
-    bqCollapse: EventEmitter<CustomEvent<{
+    bqCollapse: EventEmitter<BqSideMenuCustomEvent<{
         collapse: boolean;
     }>>;
     /**
      * Callback handler to be called when the active/selected menu item changes
      */
-    bqSelect: EventEmitter<CustomEvent<HTMLBqSideMenuItemElement>>;
+    bqSelect: EventEmitter<BqSideMenuCustomEvent<HTMLBqSideMenuItemElement>>;
 }
 declare class BqSideMenuItem {
     protected z: NgZone;
@@ -1610,9 +1646,9 @@ declare class BqSideMenuItem {
    * If true, the menu item will be disabled (no interaction allowed) @default false
    */
     set disabled(_: Components.BqSideMenuItem['disabled']);
-    bqBlur: EventEmitter<CustomEvent<HTMLBqSideMenuItemElement>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqSideMenuItemElement>>;
-    bqClick: EventEmitter<CustomEvent<HTMLBqSideMenuItemElement>>;
+    bqBlur: EventEmitter<BqSideMenuItemCustomEvent<HTMLBqSideMenuItemElement>>;
+    bqFocus: EventEmitter<BqSideMenuItemCustomEvent<HTMLBqSideMenuItemElement>>;
+    bqClick: EventEmitter<BqSideMenuItemCustomEvent<HTMLBqSideMenuItemElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqSideMenuItem, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqSideMenuItem, "bq-side-menu-item", never, { "active": { "alias": "active"; "required": false; }; "collapse": { "alias": "collapse"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "bqBlur": "bqBlur"; "bqFocus": "bqFocus"; "bqClick": "bqClick"; }, never, ["*"], false, never>;
@@ -1621,15 +1657,15 @@ declare interface BqSideMenuItem extends Components.BqSideMenuItem {
     /**
      * Handler to be called when the button loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqSideMenuItemElement>>;
+    bqBlur: EventEmitter<BqSideMenuItemCustomEvent<HTMLBqSideMenuItemElement>>;
     /**
      * Handler to be called when the button is clicked
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqSideMenuItemElement>>;
+    bqFocus: EventEmitter<BqSideMenuItemCustomEvent<HTMLBqSideMenuItemElement>>;
     /**
      * Handler to be called when button gets focus
      */
-    bqClick: EventEmitter<CustomEvent<HTMLBqSideMenuItemElement>>;
+    bqClick: EventEmitter<BqSideMenuItemCustomEvent<HTMLBqSideMenuItemElement>>;
 }
 declare class BqSlider {
     protected z: NgZone;
@@ -1686,12 +1722,12 @@ declare class BqSlider {
 It relies on enableTooltip and if enableTooltip is false, tooltipAlwaysVisible cannot be true. @default false
    */
     set tooltipAlwaysVisible(_: Components.BqSlider['tooltipAlwaysVisible']);
-    bqChange: EventEmitter<CustomEvent<{
+    bqChange: EventEmitter<BqSliderCustomEvent<{
         value: Exclude<TSliderValue, string>;
         el: HTMLBqSliderElement;
     }>>;
-    bqBlur: EventEmitter<CustomEvent<HTMLBqSliderElement>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqSliderElement>>;
+    bqBlur: EventEmitter<BqSliderCustomEvent<HTMLBqSliderElement>>;
+    bqFocus: EventEmitter<BqSliderCustomEvent<HTMLBqSliderElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqSlider, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqSlider, "bq-slider", never, { "debounceTime": { "alias": "debounceTime"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "enableTooltip": { "alias": "enableTooltip"; "required": false; }; "enableValueIndicator": { "alias": "enableValueIndicator"; "required": false; }; "gap": { "alias": "gap"; "required": false; }; "max": { "alias": "max"; "required": false; }; "min": { "alias": "min"; "required": false; }; "name": { "alias": "name"; "required": false; }; "step": { "alias": "step"; "required": false; }; "tooltipAlwaysVisible": { "alias": "tooltipAlwaysVisible"; "required": false; }; "type": { "alias": "type"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "bqChange": "bqChange"; "bqBlur": "bqBlur"; "bqFocus": "bqFocus"; }, never, ["*"], false, never>;
@@ -1700,18 +1736,18 @@ declare interface BqSlider extends Components.BqSlider {
     /**
      * Handler to be called when change the value on range inputs
      */
-    bqChange: EventEmitter<CustomEvent<{
+    bqChange: EventEmitter<BqSliderCustomEvent<{
         value: Exclude<TSliderValue, string>;
         el: HTMLBqSliderElement;
     }>>;
     /**
      * Handler to be called when the slider loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqSliderElement>>;
+    bqBlur: EventEmitter<BqSliderCustomEvent<HTMLBqSliderElement>>;
     /**
      * Handler to be called when the slider gets focused
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqSliderElement>>;
+    bqFocus: EventEmitter<BqSliderCustomEvent<HTMLBqSliderElement>>;
 }
 declare class BqSpinner {
     protected z: NgZone;
@@ -1770,9 +1806,9 @@ declare class BqStepItem {
    * It defines the step item type used
    */
     set type(_: Components.BqStepItem['type']);
-    bqClick: EventEmitter<CustomEvent<HTMLBqStepItemElement>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqStepItemElement>>;
-    bqBlur: EventEmitter<CustomEvent<HTMLBqStepItemElement>>;
+    bqClick: EventEmitter<BqStepItemCustomEvent<HTMLBqStepItemElement>>;
+    bqFocus: EventEmitter<BqStepItemCustomEvent<HTMLBqStepItemElement>>;
+    bqBlur: EventEmitter<BqStepItemCustomEvent<HTMLBqStepItemElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqStepItem, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqStepItem, "bq-step-item", never, { "dividerColor": { "alias": "dividerColor"; "required": false; }; "orientation": { "alias": "orientation"; "required": false; }; "size": { "alias": "size"; "required": false; }; "status": { "alias": "status"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, { "bqClick": "bqClick"; "bqFocus": "bqFocus"; "bqBlur": "bqBlur"; }, never, ["*"], false, never>;
@@ -1781,15 +1817,15 @@ declare interface BqStepItem extends Components.BqStepItem {
     /**
      * Callback handler triggered when the step item is clicked
      */
-    bqClick: EventEmitter<CustomEvent<HTMLBqStepItemElement>>;
+    bqClick: EventEmitter<BqStepItemCustomEvent<HTMLBqStepItemElement>>;
     /**
      * Callback handler triggered when the step item is focused
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqStepItemElement>>;
+    bqFocus: EventEmitter<BqStepItemCustomEvent<HTMLBqStepItemElement>>;
     /**
      * Callback handler triggered when the step item loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqStepItemElement>>;
+    bqBlur: EventEmitter<BqStepItemCustomEvent<HTMLBqStepItemElement>>;
 }
 declare class BqSteps {
     protected z: NgZone;
@@ -1864,11 +1900,11 @@ declare class BqSwitch {
    * The input control's value, submitted as a name/value pair with form data.
    */
     set value(_: Components.BqSwitch['value']);
-    bqChange: EventEmitter<CustomEvent<{
+    bqChange: EventEmitter<BqSwitchCustomEvent<{
         checked: boolean;
     }>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqSwitchElement>>;
-    bqBlur: EventEmitter<CustomEvent<HTMLBqSwitchElement>>;
+    bqFocus: EventEmitter<BqSwitchCustomEvent<HTMLBqSwitchElement>>;
+    bqBlur: EventEmitter<BqSwitchCustomEvent<HTMLBqSwitchElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqSwitch, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqSwitch, "bq-switch", never, { "backgroundOnHover": { "alias": "backgroundOnHover"; "required": false; }; "checked": { "alias": "checked"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "formValidationMessage": { "alias": "formValidationMessage"; "required": false; }; "fullWidth": { "alias": "fullWidth"; "required": false; }; "innerLabel": { "alias": "innerLabel"; "required": false; }; "justifyContent": { "alias": "justifyContent"; "required": false; }; "name": { "alias": "name"; "required": true; }; "required": { "alias": "required"; "required": false; }; "reverseOrder": { "alias": "reverseOrder"; "required": false; }; "value": { "alias": "value"; "required": false; }; }, { "bqChange": "bqChange"; "bqFocus": "bqFocus"; "bqBlur": "bqBlur"; }, never, ["*"], false, never>;
@@ -1877,17 +1913,17 @@ declare interface BqSwitch extends Components.BqSwitch {
     /**
      * Handler to be called when the switch state changes
      */
-    bqChange: EventEmitter<CustomEvent<{
+    bqChange: EventEmitter<BqSwitchCustomEvent<{
         checked: boolean;
     }>>;
     /**
      * Handler to be called when the switch gets focus
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqSwitchElement>>;
+    bqFocus: EventEmitter<BqSwitchCustomEvent<HTMLBqSwitchElement>>;
     /**
      * Handler to be called when the switch loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqSwitchElement>>;
+    bqBlur: EventEmitter<BqSwitchCustomEvent<HTMLBqSwitchElement>>;
 }
 declare class BqTab {
     protected z: NgZone;
@@ -1920,10 +1956,10 @@ declare class BqTab {
    * The id of the tab
    */
     set tabId(_: Components.BqTab['tabId']);
-    bqClick: EventEmitter<CustomEvent<HTMLBqTabElement>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqTabElement>>;
-    bqBlur: EventEmitter<CustomEvent<HTMLBqTabElement>>;
-    bqKeyDown: EventEmitter<CustomEvent<KeyboardEvent>>;
+    bqClick: EventEmitter<BqTabCustomEvent<HTMLBqTabElement>>;
+    bqFocus: EventEmitter<BqTabCustomEvent<HTMLBqTabElement>>;
+    bqBlur: EventEmitter<BqTabCustomEvent<HTMLBqTabElement>>;
+    bqKeyDown: EventEmitter<BqTabCustomEvent<KeyboardEvent>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqTab, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqTab, "bq-tab", never, { "active": { "alias": "active"; "required": false; }; "controls": { "alias": "controls"; "required": true; }; "disabled": { "alias": "disabled"; "required": false; }; "orientation": { "alias": "orientation"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "size": { "alias": "size"; "required": false; }; "tabId": { "alias": "tabId"; "required": true; }; }, { "bqClick": "bqClick"; "bqFocus": "bqFocus"; "bqBlur": "bqBlur"; "bqKeyDown": "bqKeyDown"; }, never, ["*"], false, never>;
@@ -1932,19 +1968,19 @@ declare interface BqTab extends Components.BqTab {
     /**
      * Handler to be called when the tab state changes
      */
-    bqClick: EventEmitter<CustomEvent<HTMLBqTabElement>>;
+    bqClick: EventEmitter<BqTabCustomEvent<HTMLBqTabElement>>;
     /**
      * Handler to be called when the tab gets focus
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqTabElement>>;
+    bqFocus: EventEmitter<BqTabCustomEvent<HTMLBqTabElement>>;
     /**
      * Handler to be called when the tab loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqTabElement>>;
+    bqBlur: EventEmitter<BqTabCustomEvent<HTMLBqTabElement>>;
     /**
      * Handler to be called when the tab key is pressed
      */
-    bqKeyDown: EventEmitter<CustomEvent<KeyboardEvent>>;
+    bqKeyDown: EventEmitter<BqTabCustomEvent<KeyboardEvent>>;
 }
 declare class BqTabGroup {
     protected z: NgZone;
@@ -1973,7 +2009,7 @@ declare class BqTabGroup {
    * A string representing the id of the selected tab.
    */
     set value(_: Components.BqTabGroup['value']);
-    bqChange: EventEmitter<CustomEvent<{
+    bqChange: EventEmitter<BqTabGroupCustomEvent<{
         target: HTMLBqTabElement;
         value: string;
     }>>;
@@ -1985,7 +2021,7 @@ declare interface BqTabGroup extends Components.BqTabGroup {
     /**
      * Handler to be called when the tab value changes
      */
-    bqChange: EventEmitter<CustomEvent<{
+    bqChange: EventEmitter<BqTabGroupCustomEvent<{
         target: HTMLBqTabElement;
         value: string;
     }>>;
@@ -2029,11 +2065,11 @@ declare class BqTag {
    * The variant of Tag to apply on top of the variant @default 'filled'
    */
     set variant(_: Components.BqTag['variant']);
-    bqClose: EventEmitter<CustomEvent<any>>;
-    bqOpen: EventEmitter<CustomEvent<any>>;
-    bqBlur: EventEmitter<CustomEvent<HTMLBqTagElement>>;
-    bqClick: EventEmitter<CustomEvent<HTMLBqTagElement>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqTagElement>>;
+    bqClose: EventEmitter<BqTagCustomEvent<any>>;
+    bqOpen: EventEmitter<BqTagCustomEvent<any>>;
+    bqBlur: EventEmitter<BqTagCustomEvent<HTMLBqTagElement>>;
+    bqClick: EventEmitter<BqTagCustomEvent<HTMLBqTagElement>>;
+    bqFocus: EventEmitter<BqTagCustomEvent<HTMLBqTagElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqTag, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqTag, "bq-tag", never, { "border": { "alias": "border"; "required": false; }; "clickable": { "alias": "clickable"; "required": false; }; "color": { "alias": "color"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "hidden": { "alias": "hidden"; "required": false; }; "removable": { "alias": "removable"; "required": false; }; "selected": { "alias": "selected"; "required": false; }; "size": { "alias": "size"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; }, { "bqClose": "bqClose"; "bqOpen": "bqOpen"; "bqBlur": "bqBlur"; "bqClick": "bqClick"; "bqFocus": "bqFocus"; }, never, ["*"], false, never>;
@@ -2042,23 +2078,23 @@ declare interface BqTag extends Components.BqTag {
     /**
      * Callback handler to be called when the tag is close/hidden
      */
-    bqClose: EventEmitter<CustomEvent<any>>;
+    bqClose: EventEmitter<BqTagCustomEvent<any>>;
     /**
      * Callback handler to be called when the tag is not open/shown
      */
-    bqOpen: EventEmitter<CustomEvent<any>>;
+    bqOpen: EventEmitter<BqTagCustomEvent<any>>;
     /**
      * Handler to be called when tag loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqTagElement>>;
+    bqBlur: EventEmitter<BqTagCustomEvent<HTMLBqTagElement>>;
     /**
      * Handler to be called when tag is clicked
      */
-    bqClick: EventEmitter<CustomEvent<HTMLBqTagElement>>;
+    bqClick: EventEmitter<BqTagCustomEvent<HTMLBqTagElement>>;
     /**
      * Handler to be called when tag is focused
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqTagElement>>;
+    bqFocus: EventEmitter<BqTagCustomEvent<HTMLBqTagElement>>;
 }
 declare class BqTextarea {
     protected z: NgZone;
@@ -2147,14 +2183,14 @@ When enabled, a character counter will be shown underneath the textarea.
    * Specifies how the text in a text area is to be wrapped when submitted in a form @default 'soft'
    */
     set wrap(_: Components.BqTextarea['wrap']);
-    bqBlur: EventEmitter<CustomEvent<HTMLBqTextareaElement>>;
-    bqChange: EventEmitter<CustomEvent<{
+    bqBlur: EventEmitter<BqTextareaCustomEvent<HTMLBqTextareaElement>>;
+    bqChange: EventEmitter<BqTextareaCustomEvent<{
         value: string;
         el: HTMLBqTextareaElement;
     }>>;
-    bqClear: EventEmitter<CustomEvent<HTMLBqTextareaElement>>;
-    bqFocus: EventEmitter<CustomEvent<HTMLBqTextareaElement>>;
-    bqInput: EventEmitter<CustomEvent<{
+    bqClear: EventEmitter<BqTextareaCustomEvent<HTMLBqTextareaElement>>;
+    bqFocus: EventEmitter<BqTextareaCustomEvent<HTMLBqTextareaElement>>;
+    bqInput: EventEmitter<BqTextareaCustomEvent<{
         value: string;
         el: HTMLBqTextareaElement;
     }>>;
@@ -2166,28 +2202,28 @@ declare interface BqTextarea extends Components.BqTextarea {
     /**
      * Callback handler emitted when the textarea loses focus
      */
-    bqBlur: EventEmitter<CustomEvent<HTMLBqTextareaElement>>;
+    bqBlur: EventEmitter<BqTextareaCustomEvent<HTMLBqTextareaElement>>;
     /**
      * Callback handler emitted when the textarea value has changed and the textarea loses focus.
   This handler is called whenever the user finishes typing or pasting text into the textarea field and then clicks outside of the textarea field.
      */
-    bqChange: EventEmitter<CustomEvent<{
+    bqChange: EventEmitter<BqTextareaCustomEvent<{
         value: string;
         el: HTMLBqTextareaElement;
     }>>;
     /**
      * Callback handler emitted when the textarea value has been cleared
      */
-    bqClear: EventEmitter<CustomEvent<HTMLBqTextareaElement>>;
+    bqClear: EventEmitter<BqTextareaCustomEvent<HTMLBqTextareaElement>>;
     /**
      * Callback handler emitted when the textarea has received focus
      */
-    bqFocus: EventEmitter<CustomEvent<HTMLBqTextareaElement>>;
+    bqFocus: EventEmitter<BqTextareaCustomEvent<HTMLBqTextareaElement>>;
     /**
      * Callback handler emitted when the textarea value changes.
   This handler is called whenever the user types or pastes text into the textarea field.
      */
-    bqInput: EventEmitter<CustomEvent<{
+    bqInput: EventEmitter<BqTextareaCustomEvent<{
         value: string;
         el: HTMLBqTextareaElement;
     }>>;
@@ -2219,8 +2255,8 @@ declare class BqToast {
    * The length of time, in milliseconds, after which the toast will close itself @default 3000
    */
     set time(_: Components.BqToast['time']);
-    bqHide: EventEmitter<CustomEvent<HTMLBqToastElement>>;
-    bqShow: EventEmitter<CustomEvent<HTMLBqToastElement>>;
+    bqHide: EventEmitter<BqToastCustomEvent<HTMLBqToastElement>>;
+    bqShow: EventEmitter<BqToastCustomEvent<HTMLBqToastElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqToast, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqToast, "bq-toast", never, { "border": { "alias": "border"; "required": false; }; "hideIcon": { "alias": "hideIcon"; "required": false; }; "open": { "alias": "open"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "time": { "alias": "time"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, { "bqHide": "bqHide"; "bqShow": "bqShow"; }, never, ["*"], false, never>;
@@ -2229,11 +2265,11 @@ declare interface BqToast extends Components.BqToast {
     /**
      * Callback handler to be called when the notification is hidden
      */
-    bqHide: EventEmitter<CustomEvent<HTMLBqToastElement>>;
+    bqHide: EventEmitter<BqToastCustomEvent<HTMLBqToastElement>>;
     /**
      * Callback handler to be called when the notification is shown
      */
-    bqShow: EventEmitter<CustomEvent<HTMLBqToastElement>>;
+    bqShow: EventEmitter<BqToastCustomEvent<HTMLBqToastElement>>;
 }
 declare class BqTooltip {
     protected z: NgZone;
@@ -2268,11 +2304,11 @@ declare class BqTooltip {
 and when interacting with the trigger @default false
    */
     set visible(_: Components.BqTooltip['visible']);
-    bqClick: EventEmitter<CustomEvent<HTMLBqTooltipElement>>;
-    bqFocusIn: EventEmitter<CustomEvent<HTMLBqTooltipElement>>;
-    bqFocusOut: EventEmitter<CustomEvent<HTMLBqTooltipElement>>;
-    bqHoverIn: EventEmitter<CustomEvent<HTMLBqTooltipElement>>;
-    bqHoverOut: EventEmitter<CustomEvent<HTMLBqTooltipElement>>;
+    bqClick: EventEmitter<BqTooltipCustomEvent<HTMLBqTooltipElement>>;
+    bqFocusIn: EventEmitter<BqTooltipCustomEvent<HTMLBqTooltipElement>>;
+    bqFocusOut: EventEmitter<BqTooltipCustomEvent<HTMLBqTooltipElement>>;
+    bqHoverIn: EventEmitter<BqTooltipCustomEvent<HTMLBqTooltipElement>>;
+    bqHoverOut: EventEmitter<BqTooltipCustomEvent<HTMLBqTooltipElement>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<BqTooltip, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<BqTooltip, "bq-tooltip", never, { "alwaysVisible": { "alias": "alwaysVisible"; "required": false; }; "displayOn": { "alias": "displayOn"; "required": false; }; "distance": { "alias": "distance"; "required": false; }; "hideArrow": { "alias": "hideArrow"; "required": false; }; "placement": { "alias": "placement"; "required": false; }; "sameWidth": { "alias": "sameWidth"; "required": false; }; "visible": { "alias": "visible"; "required": false; }; }, { "bqClick": "bqClick"; "bqFocusIn": "bqFocusIn"; "bqFocusOut": "bqFocusOut"; "bqHoverIn": "bqHoverIn"; "bqHoverOut": "bqHoverOut"; }, never, ["*"], false, never>;
@@ -2281,23 +2317,23 @@ declare interface BqTooltip extends Components.BqTooltip {
     /**
      * Emitted when the tooltip trigger is clicked
      */
-    bqClick: EventEmitter<CustomEvent<HTMLBqTooltipElement>>;
+    bqClick: EventEmitter<BqTooltipCustomEvent<HTMLBqTooltipElement>>;
     /**
      * Emitted when the tooltip trigger is focused in
      */
-    bqFocusIn: EventEmitter<CustomEvent<HTMLBqTooltipElement>>;
+    bqFocusIn: EventEmitter<BqTooltipCustomEvent<HTMLBqTooltipElement>>;
     /**
      * Emitted when the tooltip trigger is focused out
      */
-    bqFocusOut: EventEmitter<CustomEvent<HTMLBqTooltipElement>>;
+    bqFocusOut: EventEmitter<BqTooltipCustomEvent<HTMLBqTooltipElement>>;
     /**
      * Emitted when the tooltip trigger is hovered in
      */
-    bqHoverIn: EventEmitter<CustomEvent<HTMLBqTooltipElement>>;
+    bqHoverIn: EventEmitter<BqTooltipCustomEvent<HTMLBqTooltipElement>>;
     /**
      * Emitted when the tooltip trigger is hovered out
      */
-    bqHoverOut: EventEmitter<CustomEvent<HTMLBqTooltipElement>>;
+    bqHoverOut: EventEmitter<BqTooltipCustomEvent<HTMLBqTooltipElement>>;
 }
 
 declare class BeeQModule {