/* eslint-disable */
/* tslint:disable */
/**
 * This is an autogenerated file created by the Stencil compiler.
 * It contains typing information for all components that exist in this project.
 */
import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
import { CalendarEvent } from "./components/calendar/calendar";
import { DropdownItem } from "./components/dropdown-item/dropdown-item";
import { DropdownItem as DropdownItem1 } from "./components/dropdown-item/dropdown-item";
import { NumberPickerEvent } from "./components/number-picker/number-picker";
import { SearchResult } from "./components/search-result/search-result";
import { SearchResult as SearchResult1 } from "./components/search-result/search-result";
export namespace Components {
    interface IbkBadge {
        /**
          * Posición en la que se encuentra ubicado el badge
         */
        "position": 'left' | 'right';
        /**
          * Texto a mostrar
         */
        "text": string;
        /**
          * <strong>Info: </strong> color azul<br> <strong>Promo: </strong>color rojo
         */
        "type": 'info' | 'promo';
    }
    interface IbkBreadcrumb {
        /**
          * El breadcrumb se mostrará con un fondo oscuro
         */
        "negative": boolean;
        /**
          * El breadcrumb se enmarcará con dos separadores, arriba y abajo.
         */
        "separators": boolean;
    }
    interface IbkBreadcrumbItem {
        /**
          * Hace referencia a la vista actual
         */
        "current": boolean;
        /**
          * Url a donde redirigirá
         */
        "href": string;
        /**
          * El breadcrumb se mostrará con un fondo oscuro
         */
        "negative": boolean;
        /**
          * Texto que se mostrará en el item
         */
        "text": string;
    }
    interface IbkButton {
        /**
          * <strong>primary:</strong> Fondo de color con texto blanco <br> <strong>secondary:</strong> Fondo transparente con borde y texto verde <br> <strong>tertiary:</strong> Texto verde sin fondo ni borde
         */
        "appearance": 'primary' | 'secondary' | 'tertiary';
        /**
          * Determina si el botón irá al centro de la pantalla
         */
        "center": boolean;
        /**
          * Define si el botón será de color verde o azul. Por defecto será verde.
         */
        "color": 'green' | 'blue';
        /**
          * Determina si le botón se encuentra deshabilitado
         */
        "disable": boolean;
        /**
          * Determina si usará el 100% del espacio disponible
         */
        "full": boolean;
        /**
          * Crea un enlace a la url especificada
         */
        "href": string;
        /**
          * Determina si el enlace se abre en una nueva ventana o en la misma
         */
        "hrefTarget": '_self' | '_blank' | '_parent' | '_top';
        /**
          * Define un ícono que se mostrará solo o acompañará al texto
         */
        "icon": string;
        /**
          * Define la posición del icono en el caso de estar acompañado de un texto
         */
        "iconPosition": 'right' | 'left';
        /**
          * Cuando está en true, se mostrará un icono con una animación de carga.
         */
        "loading": boolean;
        /**
          * Determina si el botón se encuentra sobre un fondo oscuro
         */
        "negative": boolean;
        /**
          * Alto del botón, 40px, 48px y 56px respectivamente en desktop y 32px, 44px, 48px en mobile
         */
        "size": 'small' | 'medium' | 'large';
        /**
          * Contenido del botón
         */
        "text": string;
        /**
          * Define el tipo del botón, se usarán los tipos nativos
         */
        "type": 'button' | 'submit' | 'reset';
    }
    interface IbkButtonInline {
        /**
          * Determina si le botón se encuentra deshabilitado
         */
        "disable": boolean;
        /**
          * Crea un enlace a la url especificada
         */
        "href": string;
        /**
          * Determina si el enlace se abre en una nueva ventana o en la misma
         */
        "hrefTarget": '_self' | '_blank' | '_parent' | '_top';
        /**
          * Ícono que describe la acción. Puede ir acompañado de un texto
         */
        "icon": string;
        /**
          * Posición del ícono si existiera
         */
        "iconPosition": 'left' | 'right';
        /**
          * Contenido del botón
         */
        "text": string;
    }
    interface IbkCalendar {
        /**
          * Define la fecha final en formato DD/MM/YYYY
         */
        "endDate": string;
        /**
          * Se mostrará un mensaje de error
         */
        "error": boolean;
        /**
          * El selector del calendario ocupará el 100% del espacio disponible
         */
        "full": boolean;
        /**
          * Define la fecha inicial en formato DD/MM/YYYY
         */
        "initialDate": string;
        /**
          * Texto de ayuda encima del calendario
         */
        "label": string;
        /**
          * Define la cantidad de meses a mostrar en el selector
         */
        "months": number;
        /**
          * Define si se podrá seleccionar un rango de fechas
         */
        "multiselect": boolean;
        /**
          * Define si el calendario no contará con manejo de errores. Se omitirá el espacio generado para el mensaje de error
         */
        "noHandlingError": boolean;
        /**
          * Define hacia que lado se abrirá el calendario
         */
        "openTo": 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
        /**
          * Define un placeholder en el selector
         */
        "placeholder": string;
        /**
          * Se mostrará una barra de botones para seleccionar rápidamente entre día, última semana o último mes
         */
        "rangeSelector": 'day' | 'week' | 'month' | 'none';
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si el calendario se encuentra vacío, mostrará un mensaje de error
         */
        "required": boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage": string;
        /**
          * Define la fecha seleccionada cuando se muestra 1 mes en formato DD/MM/YYYY
         */
        "selectedDate": string;
        /**
          * Define las fechas seleccionadas cuando se muestran 2 meses en formato DD/MM/YYYY y separados por una coma
         */
        "selectedDates": string;
        /**
          * Si la candidad de meses a mostrar es 2, define si se muestra el mes siguiente o anterior
         */
        "showMonth": 'next' | 'prev';
        /**
          * Se incluye el subtitulo entre el label (si existiera) y el calendario
         */
        "subtitle": string;
    }
    interface IbkCheckbox {
        /**
          * Estado activo del checkbox
         */
        "checked": boolean;
        /**
          * Estado inactivo del checkbox
         */
        "disabled": boolean;
        /**
          * Error en el checkbox
         */
        "error": boolean;
        /**
          * Determina si el checkbox ocupa el 100% de la pantalla
         */
        "full": boolean;
        /**
          * Determina la posición del ícono
         */
        "iconPosition": 'left' | 'right';
        /**
          * Texto que describe lo que el usuario elegirá o marcará. Puede incluirse etiquetas HTML, para agregar enlaces, por ejm. Términos y condiciones. Los valores de las etiquetas HTML se incluirán con comillas simples o dobles, dependiendo de las comillas que se esten usando al definir la propiedad
         */
        "label": string;
        /**
          * El checkbox se verá envuelto en una caja
         */
        "outline": boolean;
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si el checkbox se encuentra deseleccionado, mostrará un mensaje de error
         */
        "required": boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage": string;
        /**
          * Valor del checkbox a devolver cuando sea seleccionado
         */
        "value": number | string;
    }
    interface IbkCheckboxGroup {
        /**
          * Error en el checkbox group
         */
        "error": boolean;
        /**
          * Define si los checkbox se alinearán uno al lado de otro
         */
        "inline": boolean;
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si todos los checkboxes se encuentra deseleccionados, mostrará un mensaje de error
         */
        "required": boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage": string;
        /**
          * Texto de ayuda que indica de que trata el grupo de opciones
         */
        "subtitle": string;
    }
    interface IbkDrawer {
        /**
          * Define el color del fondo del drawer
         */
        "backgroundColor": string;
        /**
          * El tamaño del drawer se limitará al contenedor especificado, por defecto es el ancho y alto disponible, dependiendo de la posición en que se visualice.<br> La propiedad recibe un selector del elemento
         */
        "container": string;
        /**
          * Determina la posición en donde se abrirá el contenido del drawer
         */
        "position": 'top' | 'right' | 'bottom' | 'left';
        /**
          * Determina si el drawer se encuentra visible o no
         */
        "show": boolean;
    }
    interface IbkDropdown {
        /**
          * El dropdown no se podrá seleccionar
         */
        "disabled": boolean;
        /**
          * Se mostrará un mensaje de error
         */
        "error": boolean;
        /**
          * Define si al seleccionar un item de la lista, este se mantendrá marcado
         */
        "keepMarked": boolean;
        /**
          * Texto de ayuda encima del dropdown
         */
        "label": string;
        /**
          * Define si el dropdown no contará con manejo de errores. Se omitirá el espacio generado para el mensaje de error
         */
        "noHandlingError": boolean;
        /**
          * Texto de ayuda dentro del campo seleccionable del dropdown
         */
        "placeholder": string;
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si el dropdown se encuentra vacío, mostrará un mensaje de error
         */
        "required": boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage": string;
        /**
          * Se agregará un campo de texto al abrir el dropdown donde se podrá ingresar texto y filtrar entre los elementos del dropdown
         */
        "searcher": boolean;
        /**
          * Se agregará un placeholder personalizado al input de busqueda
         */
        "searcherPlaceholder": string;
        /**
          * Se incluye el subtitulo entre el label (si existiera) y el dropdown
         */
        "subtitle": string;
        /**
          * El botón que desplegará el dropdown será el ícono especificado, se puede combinar con un texto
         */
        "triggerIcon": string;
        /**
          * Define el color del ícono especificado
         */
        "triggerIconColor": string;
        /**
          * El botón que desplegará el dropdown será un texto, se puede combinar con un ícono
         */
        "triggerText": string;
        /**
          * Define el color del texto especificado
         */
        "triggerTextColor": string;
        /**
          * Define un ancho fijo para el dropdown
         */
        "width": number;
    }
    interface IbkDropdownItem {
        /**
          * Dependiendo del tipo de tarjeta se agrega una imagen a la izquierda como referencia
         */
        "cardType": 'visa' | 'mastercard' | 'amex' | 'OTHER' | string;
        /**
          * Asigna un color al texto del elemento
         */
        "color": string;
        /**
          * Evita que se el elemento sea seleccionable
         */
        "disabled": boolean;
        /**
          * Se ocultará la opción de la lista
         */
        "hide": boolean;
        /**
          * Texto visible que tendrá el elemento del dropdown
         */
        "label": string;
        /**
          * Elemento actual al momento de hacer hover o mover las flechas
         */
        "preselected": boolean;
        /**
          * Elemento seleccionado del dropdown
         */
        "selected": boolean;
        /**
          * Valor que se le asigna al elemento del dropdown
         */
        "value": string | number;
    }
    interface IbkForm {
    }
    interface IbkFormGroup {
        /**
          * Define si el grupo mostrará un mensaje de error
         */
        "error": boolean;
        /**
          * Se ingresarán los anchos de los campos separados por coma. Los números ingresados deberán sumar 100 Ejm. Para un grupo de dos campos el valor de la propiedad será similar a "30,70" Estos valores serán registrados como porcentajes. Por defecto todos los campos tendrán el mismo tamaño
         */
        "fieldsWidth": string;
        /**
          * Define si los campos se encontrarán unidos, sin espaceios entre si
         */
        "joined": boolean;
        /**
          * Texto de ayuda encima del grupo de campos
         */
        "label": string;
        /**
          * Define si todos los campos del grupo son requeridos
         */
        "required": boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage": string;
        /**
          * Se incluye el subtitulo entre el label (si existiera) y el grupo de campos
         */
        "subtitle": string;
    }
    interface IbkModal {
        /**
          * Determina el color de fondo del modal
         */
        "background": 'light' | 'dark';
        /**
          * Determina si el modal tendrá una "X" para cerrar el modal
         */
        "fixed": boolean;
        /**
          * Título del modal
         */
        "heading": string;
        /**
          * Subtítulo del modal
         */
        "subtitle": string;
    }
    interface IbkNotification {
        /**
          * Define si se muestra la notificación en un contenedor
         */
        "container": 'on' | 'off';
        /**
          * Define si la notificación se mostrará fija en la parte superior de la pantalla
         */
        "fixed": boolean;
        /**
          * Mensaje a mostrar en la notificación
         */
        "message": string;
        /**
          * Define si la notificación se mantendrá oculta
         */
        "show": boolean;
        /**
          * Define el tiempo que la notificación permanecerá visible en pantalla. Si no se especifica, la notificación permanecerá visible hasta que se cambie la propiedad "hide" de forma manual. Se ingresará como valor el tiempo en milisegundos. Ejm: 2s = 2000
         */
        "timeout": number;
        /**
          * Define el tipo de notificación a mostrar<br> <strong>success: </strong>Color verde<br> <strong>error: </strong>Color rojo<br> <strong>alert: </strong>Color amarillo<br> <strong>info: </strong>Color celeste
         */
        "type": 'alert' | 'error' | 'success' | 'info';
        /**
          * Define el ancho de la notificación
         */
        "width": 'auto' | 'full' | number;
    }
    interface IbkNumberPicker {
        /**
          * Determina el número actual en el selector
         */
        "current": number;
        /**
          * Determina si el número se puede editar manualmente, por defecto solo se usarán los ícono de más y menos
         */
        "editable": boolean;
        /**
          * Determina el número máximo del selector, por defecto será 100,000
         */
        "max": number;
        /**
          * Determina el número mínimo del selector, por defecto será 0
         */
        "min": number;
        /**
          * Define el tamaño del selector<br> <strong>Medium: </strong>el ancho será para un número de dos dígitos<br> <strong>Large: </strong>el ancho será para un número de hasta 8 dígitos<br> <strong>Full: </strong>ocupará el 100% del ancho disponible
         */
        "size": 'medium' | 'large' | 'full';
    }
    interface IbkRadio {
        /**
          * Estado inactivo del radio
         */
        "disabled": boolean;
        /**
          * Error en el radio
         */
        "error": boolean;
        /**
          * Determina si el radio ocupa el 100% de la pantalla
         */
        "full": boolean;
        /**
          * Determina la posición del ícono
         */
        "iconPosition": 'left' | 'right';
        /**
          * Texto que describe lo que el usuario elegirá o marcará. Puede incluirse etiquetas HTML, para agregar enlaces, por ejm. Términos y condiciones
         */
        "label": string;
        /**
          * El radio se verá envuelto en una caja
         */
        "outline": boolean;
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si el radio se encuentra deseleccionado, mostrará un mensaje de error
         */
        "required": boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage": string;
        /**
          * Estado activo del radio
         */
        "selected": boolean;
        /**
          * Valor del radio a devolver cuando sea seleccionado
         */
        "value": number | string;
    }
    interface IbkRadioGroup {
        /**
          * Error en el radio group
         */
        "error": boolean;
        /**
          * Define si los radio se alinearán uno al lado de otro
         */
        "inline": boolean;
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si todos los radios se encuentra deseleccionados, mostrará un mensaje de error
         */
        "required": boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage": string;
        /**
          * Texto de ayuda que indica de que trata el grupo de opciones
         */
        "subtitle": string;
    }
    interface IbkSearchResult {
        /**
          * Crea un enlace a la url especificada
         */
        "href": string;
        /**
          * Determina si el enlace se abre en una nueva ventana o en la misma
         */
        "hrefTarget": '_self' | '_blank' | '_parent' | '_top';
        /**
          * Define el texto que se mostrará en el resultado
         */
        "label": string;
        /**
          * Determina si el resultado se encuentra preseleccionado
         */
        "over": boolean;
        /**
          * Define un identificador para el resultado de búsqueda
         */
        "value": string;
    }
    interface IbkSearchbar {
        /**
          * El buscador mostrará los módulos de la web de Interbank Benefit
         */
        "benefit": boolean;
        /**
          * El buscador mostrará un estilo con caja color verde alrededor
         */
        "boxed": boolean;
        /**
          * El searchbar no se podrá usar
         */
        "disabled": boolean;
        /**
          * Define si el buscador no encontró resultados
         */
        "empty": boolean;
        /**
          * Define si el ícono de la lupa se mostrará a la izquierda o derecha
         */
        "iconPosition": 'right' | 'left';
        /**
          * Texto de ayuda encima del searchbar
         */
        "label": string;
        /**
          * Define si el searchbar muestra un icono de carga mientras se hace la consulta
         */
        "loading": boolean;
        /**
          * Texto de ayuda dentro del searchbar
         */
        "placeholder": string;
        /**
          * Si el buscador pertenece a Interbank Benefit y no se encuentran resultados, se mostrará la opción de redirigir a Shopstar
         */
        "shopstarRedirect": boolean;
        /**
          * Se incluye el subtitulo entre el label (si existiera) y el searchbar
         */
        "subtitle": string;
        /**
          * Define un valor predeterminado para el searchbar
         */
        "value": string;
        /**
          * Configura un ancho fijo para el componente
         */
        "width": number;
    }
    interface IbkTable {
        /**
          * Se agregará una columna al final de la tabla con las acciones especificadas Las acciones disponibles son 'detail', 'edit' o 'delete' Las acciones se ingresaran separados por coma. Ejm: 'edit,delete'
         */
        "actions": string;
        /**
          * Define la columna que contiene el identificador de cada fila
         */
        "columnOfId": number;
        /**
          * Define la página actual del paginador
         */
        "currentPage": number;
        /**
          * Define si se mostrará una numeración por cada fila
         */
        "enumerate": boolean;
        /**
          * Buscará en cada celda el texto ingresado y lo resaltará
         */
        "filteredText": string;
        /**
          * Se eliminará el estilo por defecto de la primera fila
         */
        "notHeading": boolean;
        /**
          * Define si la tabla tendrá paginación
         */
        "paginator": boolean;
        /**
          * Define cuantas filas se mostrarán por página
         */
        "rowsPerPage": number;
        /**
          * Define si se mostrará el selector de filas
         */
        "rowsSelector": boolean;
        /**
          * Define los rangos que se podrán seleccionar en el selector de filas Se ingresará como valor números separados por comas Si se desea que el la última opción sea mostrar todas las filas se colocará "all", por ejm: "5,10,all"
         */
        "rowsToShow": string;
        /**
          * Agregará una columna al inicio con un botón para selección
         */
        "selectable": boolean;
        /**
          * Define si se mostrará un resumen de filas en la parte inferior
         */
        "showInfo": boolean;
        /**
          * Define si la información de la tabla se ordenerá Se ingresará como valor el índice a ordenar y separado por una coma el tipo de ordenamiento, ejm: 1,asc o 1,desc
         */
        "sort": string;
        /**
          * Especifica si la columna a ordenar tiene un tipo de dato concreto Los valores pueden ser 'text', 'date' o 'number' Por defecto se ordenará con el tipo texto Si el tipo es date, la fecha deberá estar en formato dd/mm/yyyy
         */
        "sortDataType": 'text' | 'date' | 'number';
    }
    interface IbkTag {
        /**
          * Define el color de fondo del tag
         */
        "color": string;
        /**
          * Ícono que se mostrará en el tag
         */
        "icon": string;
        /**
          * Define la posición del ícono a mostrar
         */
        "iconPosition": 'left' | 'right';
        /**
          * El tag solo usará el color en el borde
         */
        "outline": boolean;
        /**
          * Texto que se mostrará en el tag
         */
        "text": string;
        /**
          * Define el color del texto
         */
        "textColor": string;
        /**
          * Definir un ancho fijo para el tag
         */
        "width": number;
    }
    interface IbkTextfield {
        /**
          * El campo de texto no se podrá editar
         */
        "disabled": boolean;
        /**
          * Se mostrará un mensaje de error
         */
        "error": boolean;
        /**
          * Personaliza el mensaje de error
         */
        "errorMessage": string;
        /**
          * Texto de ayuda encima del campo de texto
         */
        "label": string;
        /**
          * Icono posicionado a la izquierda del campo de texto
         */
        "leadingIcon": string;
        /**
          * Define la cantidad máxima de caracteres en el componente
         */
        "maxLength": number;
        /**
          * Define si el textfield no contará con manejo de errores. Se omitirá el espacio generado para el mensaje de error
         */
        "noHandlingError": boolean;
        /**
          * Texto de ayuda dentro del campo de texto
         */
        "placeholder": string;
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si el campo de texto se encuentra vacío, mostrará un mensaje de error
         */
        "required": boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage": string;
        /**
          * Se incluye el subtitulo entre el label (si existiera) y el campo de texto
         */
        "subtitle": string;
        /**
          * Estado que determina si el campo de texto ha sido tocado o no
         */
        "touched": boolean;
        /**
          * Icono posicionado a la derecha del campo de texto
         */
        "trailingIcon": string;
        /**
          * Tipo de contenido que se ingresará en el campo de texto
         */
        "type": 'text' | 'password' | 'dni' | 'document' | 'email' | 'number' | 'expiration' | 'cvv' | 'phone' | 'date';
        /**
          * Contenido del campo de texto
         */
        "value": string;
        /**
          * Configura un ancho fijo para el componente
         */
        "width": number;
    }
    interface IbkTooltip {
    }
}
declare global {
    interface HTMLIbkBadgeElement extends Components.IbkBadge, HTMLStencilElement {
    }
    var HTMLIbkBadgeElement: {
        prototype: HTMLIbkBadgeElement;
        new (): HTMLIbkBadgeElement;
    };
    interface HTMLIbkBreadcrumbElement extends Components.IbkBreadcrumb, HTMLStencilElement {
    }
    var HTMLIbkBreadcrumbElement: {
        prototype: HTMLIbkBreadcrumbElement;
        new (): HTMLIbkBreadcrumbElement;
    };
    interface HTMLIbkBreadcrumbItemElement extends Components.IbkBreadcrumbItem, HTMLStencilElement {
    }
    var HTMLIbkBreadcrumbItemElement: {
        prototype: HTMLIbkBreadcrumbItemElement;
        new (): HTMLIbkBreadcrumbItemElement;
    };
    interface HTMLIbkButtonElement extends Components.IbkButton, HTMLStencilElement {
    }
    var HTMLIbkButtonElement: {
        prototype: HTMLIbkButtonElement;
        new (): HTMLIbkButtonElement;
    };
    interface HTMLIbkButtonInlineElement extends Components.IbkButtonInline, HTMLStencilElement {
    }
    var HTMLIbkButtonInlineElement: {
        prototype: HTMLIbkButtonInlineElement;
        new (): HTMLIbkButtonInlineElement;
    };
    interface HTMLIbkCalendarElement extends Components.IbkCalendar, HTMLStencilElement {
    }
    var HTMLIbkCalendarElement: {
        prototype: HTMLIbkCalendarElement;
        new (): HTMLIbkCalendarElement;
    };
    interface HTMLIbkCheckboxElement extends Components.IbkCheckbox, HTMLStencilElement {
    }
    var HTMLIbkCheckboxElement: {
        prototype: HTMLIbkCheckboxElement;
        new (): HTMLIbkCheckboxElement;
    };
    interface HTMLIbkCheckboxGroupElement extends Components.IbkCheckboxGroup, HTMLStencilElement {
    }
    var HTMLIbkCheckboxGroupElement: {
        prototype: HTMLIbkCheckboxGroupElement;
        new (): HTMLIbkCheckboxGroupElement;
    };
    interface HTMLIbkDrawerElement extends Components.IbkDrawer, HTMLStencilElement {
    }
    var HTMLIbkDrawerElement: {
        prototype: HTMLIbkDrawerElement;
        new (): HTMLIbkDrawerElement;
    };
    interface HTMLIbkDropdownElement extends Components.IbkDropdown, HTMLStencilElement {
    }
    var HTMLIbkDropdownElement: {
        prototype: HTMLIbkDropdownElement;
        new (): HTMLIbkDropdownElement;
    };
    interface HTMLIbkDropdownItemElement extends Components.IbkDropdownItem, HTMLStencilElement {
    }
    var HTMLIbkDropdownItemElement: {
        prototype: HTMLIbkDropdownItemElement;
        new (): HTMLIbkDropdownItemElement;
    };
    interface HTMLIbkFormElement extends Components.IbkForm, HTMLStencilElement {
    }
    var HTMLIbkFormElement: {
        prototype: HTMLIbkFormElement;
        new (): HTMLIbkFormElement;
    };
    interface HTMLIbkFormGroupElement extends Components.IbkFormGroup, HTMLStencilElement {
    }
    var HTMLIbkFormGroupElement: {
        prototype: HTMLIbkFormGroupElement;
        new (): HTMLIbkFormGroupElement;
    };
    interface HTMLIbkModalElement extends Components.IbkModal, HTMLStencilElement {
    }
    var HTMLIbkModalElement: {
        prototype: HTMLIbkModalElement;
        new (): HTMLIbkModalElement;
    };
    interface HTMLIbkNotificationElement extends Components.IbkNotification, HTMLStencilElement {
    }
    var HTMLIbkNotificationElement: {
        prototype: HTMLIbkNotificationElement;
        new (): HTMLIbkNotificationElement;
    };
    interface HTMLIbkNumberPickerElement extends Components.IbkNumberPicker, HTMLStencilElement {
    }
    var HTMLIbkNumberPickerElement: {
        prototype: HTMLIbkNumberPickerElement;
        new (): HTMLIbkNumberPickerElement;
    };
    interface HTMLIbkRadioElement extends Components.IbkRadio, HTMLStencilElement {
    }
    var HTMLIbkRadioElement: {
        prototype: HTMLIbkRadioElement;
        new (): HTMLIbkRadioElement;
    };
    interface HTMLIbkRadioGroupElement extends Components.IbkRadioGroup, HTMLStencilElement {
    }
    var HTMLIbkRadioGroupElement: {
        prototype: HTMLIbkRadioGroupElement;
        new (): HTMLIbkRadioGroupElement;
    };
    interface HTMLIbkSearchResultElement extends Components.IbkSearchResult, HTMLStencilElement {
    }
    var HTMLIbkSearchResultElement: {
        prototype: HTMLIbkSearchResultElement;
        new (): HTMLIbkSearchResultElement;
    };
    interface HTMLIbkSearchbarElement extends Components.IbkSearchbar, HTMLStencilElement {
    }
    var HTMLIbkSearchbarElement: {
        prototype: HTMLIbkSearchbarElement;
        new (): HTMLIbkSearchbarElement;
    };
    interface HTMLIbkTableElement extends Components.IbkTable, HTMLStencilElement {
    }
    var HTMLIbkTableElement: {
        prototype: HTMLIbkTableElement;
        new (): HTMLIbkTableElement;
    };
    interface HTMLIbkTagElement extends Components.IbkTag, HTMLStencilElement {
    }
    var HTMLIbkTagElement: {
        prototype: HTMLIbkTagElement;
        new (): HTMLIbkTagElement;
    };
    interface HTMLIbkTextfieldElement extends Components.IbkTextfield, HTMLStencilElement {
    }
    var HTMLIbkTextfieldElement: {
        prototype: HTMLIbkTextfieldElement;
        new (): HTMLIbkTextfieldElement;
    };
    interface HTMLIbkTooltipElement extends Components.IbkTooltip, HTMLStencilElement {
    }
    var HTMLIbkTooltipElement: {
        prototype: HTMLIbkTooltipElement;
        new (): HTMLIbkTooltipElement;
    };
    interface HTMLElementTagNameMap {
        "ibk-badge": HTMLIbkBadgeElement;
        "ibk-breadcrumb": HTMLIbkBreadcrumbElement;
        "ibk-breadcrumb-item": HTMLIbkBreadcrumbItemElement;
        "ibk-button": HTMLIbkButtonElement;
        "ibk-button-inline": HTMLIbkButtonInlineElement;
        "ibk-calendar": HTMLIbkCalendarElement;
        "ibk-checkbox": HTMLIbkCheckboxElement;
        "ibk-checkbox-group": HTMLIbkCheckboxGroupElement;
        "ibk-drawer": HTMLIbkDrawerElement;
        "ibk-dropdown": HTMLIbkDropdownElement;
        "ibk-dropdown-item": HTMLIbkDropdownItemElement;
        "ibk-form": HTMLIbkFormElement;
        "ibk-form-group": HTMLIbkFormGroupElement;
        "ibk-modal": HTMLIbkModalElement;
        "ibk-notification": HTMLIbkNotificationElement;
        "ibk-number-picker": HTMLIbkNumberPickerElement;
        "ibk-radio": HTMLIbkRadioElement;
        "ibk-radio-group": HTMLIbkRadioGroupElement;
        "ibk-search-result": HTMLIbkSearchResultElement;
        "ibk-searchbar": HTMLIbkSearchbarElement;
        "ibk-table": HTMLIbkTableElement;
        "ibk-tag": HTMLIbkTagElement;
        "ibk-textfield": HTMLIbkTextfieldElement;
        "ibk-tooltip": HTMLIbkTooltipElement;
    }
}
declare namespace LocalJSX {
    interface IbkBadge {
        /**
          * Posición en la que se encuentra ubicado el badge
         */
        "position"?: 'left' | 'right';
        /**
          * Texto a mostrar
         */
        "text"?: string;
        /**
          * <strong>Info: </strong> color azul<br> <strong>Promo: </strong>color rojo
         */
        "type"?: 'info' | 'promo';
    }
    interface IbkBreadcrumb {
        /**
          * El breadcrumb se mostrará con un fondo oscuro
         */
        "negative"?: boolean;
        /**
          * El breadcrumb se enmarcará con dos separadores, arriba y abajo.
         */
        "separators"?: boolean;
    }
    interface IbkBreadcrumbItem {
        /**
          * Hace referencia a la vista actual
         */
        "current"?: boolean;
        /**
          * Url a donde redirigirá
         */
        "href"?: string;
        /**
          * El breadcrumb se mostrará con un fondo oscuro
         */
        "negative"?: boolean;
        /**
          * Emite el evento click
         */
        "onOnclick"?: (event: CustomEvent<any>) => void;
        /**
          * Texto que se mostrará en el item
         */
        "text"?: string;
    }
    interface IbkButton {
        /**
          * <strong>primary:</strong> Fondo de color con texto blanco <br> <strong>secondary:</strong> Fondo transparente con borde y texto verde <br> <strong>tertiary:</strong> Texto verde sin fondo ni borde
         */
        "appearance"?: 'primary' | 'secondary' | 'tertiary';
        /**
          * Determina si el botón irá al centro de la pantalla
         */
        "center"?: boolean;
        /**
          * Define si el botón será de color verde o azul. Por defecto será verde.
         */
        "color"?: 'green' | 'blue';
        /**
          * Determina si le botón se encuentra deshabilitado
         */
        "disable"?: boolean;
        /**
          * Determina si usará el 100% del espacio disponible
         */
        "full"?: boolean;
        /**
          * Crea un enlace a la url especificada
         */
        "href"?: string;
        /**
          * Determina si el enlace se abre en una nueva ventana o en la misma
         */
        "hrefTarget"?: '_self' | '_blank' | '_parent' | '_top';
        /**
          * Define un ícono que se mostrará solo o acompañará al texto
         */
        "icon"?: string;
        /**
          * Define la posición del icono en el caso de estar acompañado de un texto
         */
        "iconPosition"?: 'right' | 'left';
        /**
          * Cuando está en true, se mostrará un icono con una animación de carga.
         */
        "loading"?: boolean;
        /**
          * Determina si el botón se encuentra sobre un fondo oscuro
         */
        "negative"?: boolean;
        /**
          * Emite el evento click
         */
        "onOnclick"?: (event: CustomEvent<any>) => void;
        /**
          * Alto del botón, 40px, 48px y 56px respectivamente en desktop y 32px, 44px, 48px en mobile
         */
        "size"?: 'small' | 'medium' | 'large';
        /**
          * Contenido del botón
         */
        "text"?: string;
        /**
          * Define el tipo del botón, se usarán los tipos nativos
         */
        "type"?: 'button' | 'submit' | 'reset';
    }
    interface IbkButtonInline {
        /**
          * Determina si le botón se encuentra deshabilitado
         */
        "disable"?: boolean;
        /**
          * Crea un enlace a la url especificada
         */
        "href"?: string;
        /**
          * Determina si el enlace se abre en una nueva ventana o en la misma
         */
        "hrefTarget"?: '_self' | '_blank' | '_parent' | '_top';
        /**
          * Ícono que describe la acción. Puede ir acompañado de un texto
         */
        "icon"?: string;
        /**
          * Posición del ícono si existiera
         */
        "iconPosition"?: 'left' | 'right';
        /**
          * Emite el evento click
         */
        "onOnclick"?: (event: CustomEvent<any>) => void;
        /**
          * Contenido del botón
         */
        "text"?: string;
    }
    interface IbkCalendar {
        /**
          * Define la fecha final en formato DD/MM/YYYY
         */
        "endDate"?: string;
        /**
          * Se mostrará un mensaje de error
         */
        "error"?: boolean;
        /**
          * El selector del calendario ocupará el 100% del espacio disponible
         */
        "full"?: boolean;
        /**
          * Define la fecha inicial en formato DD/MM/YYYY
         */
        "initialDate"?: string;
        /**
          * Texto de ayuda encima del calendario
         */
        "label"?: string;
        /**
          * Define la cantidad de meses a mostrar en el selector
         */
        "months"?: number;
        /**
          * Define si se podrá seleccionar un rango de fechas
         */
        "multiselect"?: boolean;
        /**
          * Define si el calendario no contará con manejo de errores. Se omitirá el espacio generado para el mensaje de error
         */
        "noHandlingError"?: boolean;
        /**
          * Emite un evento al seleccionar una fecha única o un rango. Retorna un objeto único cuando el selector es de una sola fecha y retorna un Array de objetos cuando se selecciona un rango
         */
        "onOnselect"?: (event: CustomEvent<CalendarEvent | Array<CalendarEvent>>) => void;
        /**
          * Define hacia que lado se abrirá el calendario
         */
        "openTo"?: 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
        /**
          * Define un placeholder en el selector
         */
        "placeholder"?: string;
        /**
          * Se mostrará una barra de botones para seleccionar rápidamente entre día, última semana o último mes
         */
        "rangeSelector"?: 'day' | 'week' | 'month' | 'none';
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si el calendario se encuentra vacío, mostrará un mensaje de error
         */
        "required"?: boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage"?: string;
        /**
          * Define la fecha seleccionada cuando se muestra 1 mes en formato DD/MM/YYYY
         */
        "selectedDate"?: string;
        /**
          * Define las fechas seleccionadas cuando se muestran 2 meses en formato DD/MM/YYYY y separados por una coma
         */
        "selectedDates"?: string;
        /**
          * Si la candidad de meses a mostrar es 2, define si se muestra el mes siguiente o anterior
         */
        "showMonth"?: 'next' | 'prev';
        /**
          * Se incluye el subtitulo entre el label (si existiera) y el calendario
         */
        "subtitle"?: string;
    }
    interface IbkCheckbox {
        /**
          * Estado activo del checkbox
         */
        "checked"?: boolean;
        /**
          * Estado inactivo del checkbox
         */
        "disabled"?: boolean;
        /**
          * Error en el checkbox
         */
        "error"?: boolean;
        /**
          * Determina si el checkbox ocupa el 100% de la pantalla
         */
        "full"?: boolean;
        /**
          * Determina la posición del ícono
         */
        "iconPosition"?: 'left' | 'right';
        /**
          * Texto que describe lo que el usuario elegirá o marcará. Puede incluirse etiquetas HTML, para agregar enlaces, por ejm. Términos y condiciones. Los valores de las etiquetas HTML se incluirán con comillas simples o dobles, dependiendo de las comillas que se esten usando al definir la propiedad
         */
        "label"?: string;
        /**
          * Emite un evento con el detalle del checkbox seleccionado
         */
        "onOnchecked"?: (event: CustomEvent<any>) => void;
        /**
          * El checkbox se verá envuelto en una caja
         */
        "outline"?: boolean;
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si el checkbox se encuentra deseleccionado, mostrará un mensaje de error
         */
        "required"?: boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage"?: string;
        /**
          * Valor del checkbox a devolver cuando sea seleccionado
         */
        "value"?: number | string;
    }
    interface IbkCheckboxGroup {
        /**
          * Error en el checkbox group
         */
        "error"?: boolean;
        /**
          * Define si los checkbox se alinearán uno al lado de otro
         */
        "inline"?: boolean;
        /**
          * Emite un evento con el detalle de cada checkbox seleccionado
         */
        "onOncheckedgroup"?: (event: CustomEvent<any>) => void;
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si todos los checkboxes se encuentra deseleccionados, mostrará un mensaje de error
         */
        "required"?: boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage"?: string;
        /**
          * Texto de ayuda que indica de que trata el grupo de opciones
         */
        "subtitle"?: string;
    }
    interface IbkDrawer {
        /**
          * Define el color del fondo del drawer
         */
        "backgroundColor"?: string;
        /**
          * El tamaño del drawer se limitará al contenedor especificado, por defecto es el ancho y alto disponible, dependiendo de la posición en que se visualice.<br> La propiedad recibe un selector del elemento
         */
        "container"?: string;
        /**
          * Determina la posición en donde se abrirá el contenido del drawer
         */
        "position"?: 'top' | 'right' | 'bottom' | 'left';
        /**
          * Determina si el drawer se encuentra visible o no
         */
        "show"?: boolean;
    }
    interface IbkDropdown {
        /**
          * El dropdown no se podrá seleccionar
         */
        "disabled"?: boolean;
        /**
          * Se mostrará un mensaje de error
         */
        "error"?: boolean;
        /**
          * Define si al seleccionar un item de la lista, este se mantendrá marcado
         */
        "keepMarked"?: boolean;
        /**
          * Texto de ayuda encima del dropdown
         */
        "label"?: string;
        /**
          * Define si el dropdown no contará con manejo de errores. Se omitirá el espacio generado para el mensaje de error
         */
        "noHandlingError"?: boolean;
        /**
          * Emite un evento cuando se selecciona un item y lo envía como parámetro
         */
        "onOnchange"?: (event: CustomEvent<DropdownItem>) => void;
        /**
          * Texto de ayuda dentro del campo seleccionable del dropdown
         */
        "placeholder"?: string;
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si el dropdown se encuentra vacío, mostrará un mensaje de error
         */
        "required"?: boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage"?: string;
        /**
          * Se agregará un campo de texto al abrir el dropdown donde se podrá ingresar texto y filtrar entre los elementos del dropdown
         */
        "searcher"?: boolean;
        /**
          * Se agregará un placeholder personalizado al input de busqueda
         */
        "searcherPlaceholder"?: string;
        /**
          * Se incluye el subtitulo entre el label (si existiera) y el dropdown
         */
        "subtitle"?: string;
        /**
          * El botón que desplegará el dropdown será el ícono especificado, se puede combinar con un texto
         */
        "triggerIcon"?: string;
        /**
          * Define el color del ícono especificado
         */
        "triggerIconColor"?: string;
        /**
          * El botón que desplegará el dropdown será un texto, se puede combinar con un ícono
         */
        "triggerText"?: string;
        /**
          * Define el color del texto especificado
         */
        "triggerTextColor"?: string;
        /**
          * Define un ancho fijo para el dropdown
         */
        "width"?: number;
    }
    interface IbkDropdownItem {
        /**
          * Dependiendo del tipo de tarjeta se agrega una imagen a la izquierda como referencia
         */
        "cardType"?: 'visa' | 'mastercard' | 'amex' | 'OTHER' | string;
        /**
          * Asigna un color al texto del elemento
         */
        "color"?: string;
        /**
          * Evita que se el elemento sea seleccionable
         */
        "disabled"?: boolean;
        /**
          * Se ocultará la opción de la lista
         */
        "hide"?: boolean;
        /**
          * Texto visible que tendrá el elemento del dropdown
         */
        "label"?: string;
        /**
          * Le envía al componente "ibk-dropdown" el elemento seleccionado con sus propiedades
         */
        "onOnselect"?: (event: CustomEvent<DropdownItem>) => void;
        /**
          * Elemento actual al momento de hacer hover o mover las flechas
         */
        "preselected"?: boolean;
        /**
          * Elemento seleccionado del dropdown
         */
        "selected"?: boolean;
        /**
          * Valor que se le asigna al elemento del dropdown
         */
        "value"?: string | number;
    }
    interface IbkForm {
        /**
          * Emite un evento al hacer submit del formulario, envia un dato boolean en true cuando el formulario es válido y false cuando no lo es
         */
        "onOnsubmit"?: (event: CustomEvent<boolean>) => void;
    }
    interface IbkFormGroup {
        /**
          * Define si el grupo mostrará un mensaje de error
         */
        "error"?: boolean;
        /**
          * Se ingresarán los anchos de los campos separados por coma. Los números ingresados deberán sumar 100 Ejm. Para un grupo de dos campos el valor de la propiedad será similar a "30,70" Estos valores serán registrados como porcentajes. Por defecto todos los campos tendrán el mismo tamaño
         */
        "fieldsWidth"?: string;
        /**
          * Define si los campos se encontrarán unidos, sin espaceios entre si
         */
        "joined"?: boolean;
        /**
          * Texto de ayuda encima del grupo de campos
         */
        "label"?: string;
        /**
          * Define si todos los campos del grupo son requeridos
         */
        "required"?: boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage"?: string;
        /**
          * Se incluye el subtitulo entre el label (si existiera) y el grupo de campos
         */
        "subtitle"?: string;
    }
    interface IbkModal {
        /**
          * Determina el color de fondo del modal
         */
        "background"?: 'light' | 'dark';
        /**
          * Determina si el modal tendrá una "X" para cerrar el modal
         */
        "fixed"?: boolean;
        /**
          * Título del modal
         */
        "heading"?: string;
        /**
          * Subtítulo del modal
         */
        "subtitle"?: string;
    }
    interface IbkNotification {
        /**
          * Define si se muestra la notificación en un contenedor
         */
        "container"?: 'on' | 'off';
        /**
          * Define si la notificación se mostrará fija en la parte superior de la pantalla
         */
        "fixed"?: boolean;
        /**
          * Mensaje a mostrar en la notificación
         */
        "message"?: string;
        /**
          * Define si la notificación se mantendrá oculta
         */
        "show"?: boolean;
        /**
          * Define el tiempo que la notificación permanecerá visible en pantalla. Si no se especifica, la notificación permanecerá visible hasta que se cambie la propiedad "hide" de forma manual. Se ingresará como valor el tiempo en milisegundos. Ejm: 2s = 2000
         */
        "timeout"?: number;
        /**
          * Define el tipo de notificación a mostrar<br> <strong>success: </strong>Color verde<br> <strong>error: </strong>Color rojo<br> <strong>alert: </strong>Color amarillo<br> <strong>info: </strong>Color celeste
         */
        "type"?: 'alert' | 'error' | 'success' | 'info';
        /**
          * Define el ancho de la notificación
         */
        "width"?: 'auto' | 'full' | number;
    }
    interface IbkNumberPicker {
        /**
          * Determina el número actual en el selector
         */
        "current"?: number;
        /**
          * Determina si el número se puede editar manualmente, por defecto solo se usarán los ícono de más y menos
         */
        "editable"?: boolean;
        /**
          * Determina el número máximo del selector, por defecto será 100,000
         */
        "max"?: number;
        /**
          * Determina el número mínimo del selector, por defecto será 0
         */
        "min"?: number;
        /**
          * Evento al cambiar el número con los botones más y menos, o digitando manualmente
         */
        "onOnchange"?: (event: CustomEvent<NumberPickerEvent>) => void;
        /**
          * Define el tamaño del selector<br> <strong>Medium: </strong>el ancho será para un número de dos dígitos<br> <strong>Large: </strong>el ancho será para un número de hasta 8 dígitos<br> <strong>Full: </strong>ocupará el 100% del ancho disponible
         */
        "size"?: 'medium' | 'large' | 'full';
    }
    interface IbkRadio {
        /**
          * Estado inactivo del radio
         */
        "disabled"?: boolean;
        /**
          * Error en el radio
         */
        "error"?: boolean;
        /**
          * Determina si el radio ocupa el 100% de la pantalla
         */
        "full"?: boolean;
        /**
          * Determina la posición del ícono
         */
        "iconPosition"?: 'left' | 'right';
        /**
          * Texto que describe lo que el usuario elegirá o marcará. Puede incluirse etiquetas HTML, para agregar enlaces, por ejm. Términos y condiciones
         */
        "label"?: string;
        /**
          * Emite un evento con el detalle del radio seleccionado
         */
        "onOnselect"?: (event: CustomEvent<any>) => void;
        /**
          * El radio se verá envuelto en una caja
         */
        "outline"?: boolean;
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si el radio se encuentra deseleccionado, mostrará un mensaje de error
         */
        "required"?: boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage"?: string;
        /**
          * Estado activo del radio
         */
        "selected"?: boolean;
        /**
          * Valor del radio a devolver cuando sea seleccionado
         */
        "value"?: number | string;
    }
    interface IbkRadioGroup {
        /**
          * Error en el radio group
         */
        "error"?: boolean;
        /**
          * Define si los radio se alinearán uno al lado de otro
         */
        "inline"?: boolean;
        /**
          * Emite un evento con el detalle de cada radio seleccionado
         */
        "onOnchange"?: (event: CustomEvent<any>) => void;
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si todos los radios se encuentra deseleccionados, mostrará un mensaje de error
         */
        "required"?: boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage"?: string;
        /**
          * Texto de ayuda que indica de que trata el grupo de opciones
         */
        "subtitle"?: string;
    }
    interface IbkSearchResult {
        /**
          * Crea un enlace a la url especificada
         */
        "href"?: string;
        /**
          * Determina si el enlace se abre en una nueva ventana o en la misma
         */
        "hrefTarget"?: '_self' | '_blank' | '_parent' | '_top';
        /**
          * Define el texto que se mostrará en el resultado
         */
        "label"?: string;
        /**
          * Emite un evento al seleccionar la opción
         */
        "onOnclick"?: (event: CustomEvent<SearchResult>) => void;
        /**
          * Determina si el resultado se encuentra preseleccionado
         */
        "over"?: boolean;
        /**
          * Define un identificador para el resultado de búsqueda
         */
        "value"?: string;
    }
    interface IbkSearchbar {
        /**
          * El buscador mostrará los módulos de la web de Interbank Benefit
         */
        "benefit"?: boolean;
        /**
          * El buscador mostrará un estilo con caja color verde alrededor
         */
        "boxed"?: boolean;
        /**
          * El searchbar no se podrá usar
         */
        "disabled"?: boolean;
        /**
          * Define si el buscador no encontró resultados
         */
        "empty"?: boolean;
        /**
          * Define si el ícono de la lupa se mostrará a la izquierda o derecha
         */
        "iconPosition"?: 'right' | 'left';
        /**
          * Texto de ayuda encima del searchbar
         */
        "label"?: string;
        /**
          * Define si el searchbar muestra un icono de carga mientras se hace la consulta
         */
        "loading"?: boolean;
        /**
          * Emite un evento cuando se selecciona alguno de los botones de Interbank Benefit, envía como dato el id del módulo
         */
        "onOnbenefitclick"?: (event: CustomEvent<number>) => void;
        /**
          * Emite un evento al escribir
         */
        "onOnedit"?: (event: CustomEvent<string>) => void;
        /**
          * Emite un evento cuando el searchbar contenga 3 caracteres para realizar la búsqueda
         */
        "onOnsearch"?: (event: CustomEvent<any>) => void;
        /**
          * Emite un evento cuando se selecciona uno de los resultados, enviando un objeto con los datos del resultado
         */
        "onOnselect"?: (event: CustomEvent<SearchResult>) => void;
        /**
          * Texto de ayuda dentro del searchbar
         */
        "placeholder"?: string;
        /**
          * Si el buscador pertenece a Interbank Benefit y no se encuentran resultados, se mostrará la opción de redirigir a Shopstar
         */
        "shopstarRedirect"?: boolean;
        /**
          * Se incluye el subtitulo entre el label (si existiera) y el searchbar
         */
        "subtitle"?: string;
        /**
          * Define un valor predeterminado para el searchbar
         */
        "value"?: string;
        /**
          * Configura un ancho fijo para el componente
         */
        "width"?: number;
    }
    interface IbkTable {
        /**
          * Se agregará una columna al final de la tabla con las acciones especificadas Las acciones disponibles son 'detail', 'edit' o 'delete' Las acciones se ingresaran separados por coma. Ejm: 'edit,delete'
         */
        "actions"?: string;
        /**
          * Define la columna que contiene el identificador de cada fila
         */
        "columnOfId"?: number;
        /**
          * Define la página actual del paginador
         */
        "currentPage"?: number;
        /**
          * Define si se mostrará una numeración por cada fila
         */
        "enumerate"?: boolean;
        /**
          * Buscará en cada celda el texto ingresado y lo resaltará
         */
        "filteredText"?: string;
        /**
          * Se eliminará el estilo por defecto de la primera fila
         */
        "notHeading"?: boolean;
        /**
          * Emite un evento al seleccionar la acción de eliminar
         */
        "onOndelete"?: (event: CustomEvent<string | number>) => void;
        /**
          * Emite un evento al seleccionar la acción de ver detalle
         */
        "onOndetail"?: (event: CustomEvent<string | number>) => void;
        /**
          * Emite un evento al seleccionar la acción de editar
         */
        "onOnedit"?: (event: CustomEvent<string | number>) => void;
        /**
          * Emite un evento al seleccionar una o varias filas de la tabla, envía un arreglo con los índices seleccionados
         */
        "onOnselect"?: (event: CustomEvent<Array<number | string>>) => void;
        /**
          * Define si la tabla tendrá paginación
         */
        "paginator"?: boolean;
        /**
          * Define cuantas filas se mostrarán por página
         */
        "rowsPerPage"?: number;
        /**
          * Define si se mostrará el selector de filas
         */
        "rowsSelector"?: boolean;
        /**
          * Define los rangos que se podrán seleccionar en el selector de filas Se ingresará como valor números separados por comas Si se desea que el la última opción sea mostrar todas las filas se colocará "all", por ejm: "5,10,all"
         */
        "rowsToShow"?: string;
        /**
          * Agregará una columna al inicio con un botón para selección
         */
        "selectable"?: boolean;
        /**
          * Define si se mostrará un resumen de filas en la parte inferior
         */
        "showInfo"?: boolean;
        /**
          * Define si la información de la tabla se ordenerá Se ingresará como valor el índice a ordenar y separado por una coma el tipo de ordenamiento, ejm: 1,asc o 1,desc
         */
        "sort"?: string;
        /**
          * Especifica si la columna a ordenar tiene un tipo de dato concreto Los valores pueden ser 'text', 'date' o 'number' Por defecto se ordenará con el tipo texto Si el tipo es date, la fecha deberá estar en formato dd/mm/yyyy
         */
        "sortDataType"?: 'text' | 'date' | 'number';
    }
    interface IbkTag {
        /**
          * Define el color de fondo del tag
         */
        "color"?: string;
        /**
          * Ícono que se mostrará en el tag
         */
        "icon"?: string;
        /**
          * Define la posición del ícono a mostrar
         */
        "iconPosition"?: 'left' | 'right';
        /**
          * El tag solo usará el color en el borde
         */
        "outline"?: boolean;
        /**
          * Texto que se mostrará en el tag
         */
        "text"?: string;
        /**
          * Define el color del texto
         */
        "textColor"?: string;
        /**
          * Definir un ancho fijo para el tag
         */
        "width"?: number;
    }
    interface IbkTextfield {
        /**
          * El campo de texto no se podrá editar
         */
        "disabled"?: boolean;
        /**
          * Se mostrará un mensaje de error
         */
        "error"?: boolean;
        /**
          * Personaliza el mensaje de error
         */
        "errorMessage"?: string;
        /**
          * Texto de ayuda encima del campo de texto
         */
        "label"?: string;
        /**
          * Icono posicionado a la izquierda del campo de texto
         */
        "leadingIcon"?: string;
        /**
          * Define la cantidad máxima de caracteres en el componente
         */
        "maxLength"?: number;
        /**
          * Define si el textfield no contará con manejo de errores. Se omitirá el espacio generado para el mensaje de error
         */
        "noHandlingError"?: boolean;
        /**
          * Emite un evento mientras se escribe en el campo de texto, envía el contenido actual como parámetro
         */
        "onOnchange"?: (event: CustomEvent<string>) => void;
        /**
          * Emite un evento al hacer focusin o focusout del campo de texto, envía como detalle "out" o "in"
         */
        "onOnfocus"?: (event: CustomEvent<string>) => void;
        /**
          * Texto de ayuda dentro del campo de texto
         */
        "placeholder"?: string;
        /**
          * Cuando se encuentra dentro de un "ibk-form" al hacer submit si el campo de texto se encuentra vacío, mostrará un mensaje de error
         */
        "required"?: boolean;
        /**
          * Personaliza el mensaje de campo requerido
         */
        "requiredMessage"?: string;
        /**
          * Se incluye el subtitulo entre el label (si existiera) y el campo de texto
         */
        "subtitle"?: string;
        /**
          * Estado que determina si el campo de texto ha sido tocado o no
         */
        "touched"?: boolean;
        /**
          * Icono posicionado a la derecha del campo de texto
         */
        "trailingIcon"?: string;
        /**
          * Tipo de contenido que se ingresará en el campo de texto
         */
        "type"?: 'text' | 'password' | 'dni' | 'document' | 'email' | 'number' | 'expiration' | 'cvv' | 'phone' | 'date';
        /**
          * Contenido del campo de texto
         */
        "value"?: string;
        /**
          * Configura un ancho fijo para el componente
         */
        "width"?: number;
    }
    interface IbkTooltip {
    }
    interface IntrinsicElements {
        "ibk-badge": IbkBadge;
        "ibk-breadcrumb": IbkBreadcrumb;
        "ibk-breadcrumb-item": IbkBreadcrumbItem;
        "ibk-button": IbkButton;
        "ibk-button-inline": IbkButtonInline;
        "ibk-calendar": IbkCalendar;
        "ibk-checkbox": IbkCheckbox;
        "ibk-checkbox-group": IbkCheckboxGroup;
        "ibk-drawer": IbkDrawer;
        "ibk-dropdown": IbkDropdown;
        "ibk-dropdown-item": IbkDropdownItem;
        "ibk-form": IbkForm;
        "ibk-form-group": IbkFormGroup;
        "ibk-modal": IbkModal;
        "ibk-notification": IbkNotification;
        "ibk-number-picker": IbkNumberPicker;
        "ibk-radio": IbkRadio;
        "ibk-radio-group": IbkRadioGroup;
        "ibk-search-result": IbkSearchResult;
        "ibk-searchbar": IbkSearchbar;
        "ibk-table": IbkTable;
        "ibk-tag": IbkTag;
        "ibk-textfield": IbkTextfield;
        "ibk-tooltip": IbkTooltip;
    }
}
export { LocalJSX as JSX };
declare module "@stencil/core" {
    export namespace JSX {
        interface IntrinsicElements {
            "ibk-badge": LocalJSX.IbkBadge & JSXBase.HTMLAttributes<HTMLIbkBadgeElement>;
            "ibk-breadcrumb": LocalJSX.IbkBreadcrumb & JSXBase.HTMLAttributes<HTMLIbkBreadcrumbElement>;
            "ibk-breadcrumb-item": LocalJSX.IbkBreadcrumbItem & JSXBase.HTMLAttributes<HTMLIbkBreadcrumbItemElement>;
            "ibk-button": LocalJSX.IbkButton & JSXBase.HTMLAttributes<HTMLIbkButtonElement>;
            "ibk-button-inline": LocalJSX.IbkButtonInline & JSXBase.HTMLAttributes<HTMLIbkButtonInlineElement>;
            "ibk-calendar": LocalJSX.IbkCalendar & JSXBase.HTMLAttributes<HTMLIbkCalendarElement>;
            "ibk-checkbox": LocalJSX.IbkCheckbox & JSXBase.HTMLAttributes<HTMLIbkCheckboxElement>;
            "ibk-checkbox-group": LocalJSX.IbkCheckboxGroup & JSXBase.HTMLAttributes<HTMLIbkCheckboxGroupElement>;
            "ibk-drawer": LocalJSX.IbkDrawer & JSXBase.HTMLAttributes<HTMLIbkDrawerElement>;
            "ibk-dropdown": LocalJSX.IbkDropdown & JSXBase.HTMLAttributes<HTMLIbkDropdownElement>;
            "ibk-dropdown-item": LocalJSX.IbkDropdownItem & JSXBase.HTMLAttributes<HTMLIbkDropdownItemElement>;
            "ibk-form": LocalJSX.IbkForm & JSXBase.HTMLAttributes<HTMLIbkFormElement>;
            "ibk-form-group": LocalJSX.IbkFormGroup & JSXBase.HTMLAttributes<HTMLIbkFormGroupElement>;
            "ibk-modal": LocalJSX.IbkModal & JSXBase.HTMLAttributes<HTMLIbkModalElement>;
            "ibk-notification": LocalJSX.IbkNotification & JSXBase.HTMLAttributes<HTMLIbkNotificationElement>;
            "ibk-number-picker": LocalJSX.IbkNumberPicker & JSXBase.HTMLAttributes<HTMLIbkNumberPickerElement>;
            "ibk-radio": LocalJSX.IbkRadio & JSXBase.HTMLAttributes<HTMLIbkRadioElement>;
            "ibk-radio-group": LocalJSX.IbkRadioGroup & JSXBase.HTMLAttributes<HTMLIbkRadioGroupElement>;
            "ibk-search-result": LocalJSX.IbkSearchResult & JSXBase.HTMLAttributes<HTMLIbkSearchResultElement>;
            "ibk-searchbar": LocalJSX.IbkSearchbar & JSXBase.HTMLAttributes<HTMLIbkSearchbarElement>;
            "ibk-table": LocalJSX.IbkTable & JSXBase.HTMLAttributes<HTMLIbkTableElement>;
            "ibk-tag": LocalJSX.IbkTag & JSXBase.HTMLAttributes<HTMLIbkTagElement>;
            "ibk-textfield": LocalJSX.IbkTextfield & JSXBase.HTMLAttributes<HTMLIbkTextfieldElement>;
            "ibk-tooltip": LocalJSX.IbkTooltip & JSXBase.HTMLAttributes<HTMLIbkTooltipElement>;
        }
    }
}
