/* 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 { collapses } from "./components/accordion/accordion-group"; import { AlertHeaderVariannt } from "./components/alert/alert-header/alert-header"; import { AutocompleteChangeEventDetail, AutocompleteMultiSelectedChangeEventDetail, AutocompleteOption, AutocompleteOptionsPositionType, AutocompleteSelectedChangeEventDetail } from "./components/autocomplete/autocomplete-select-interface"; import { languages } from "./components/autocomplete/languages"; import { SelectionType } from "./components/autocomplete/autocomplete"; import { avatarSize, colors } from "./components/avatar/avatar"; import { avatarSize as avatarSize1 } from "./components/avatar-group/avatar-group"; import { AvatarDataList } from "./components/avatar-group/avatar-group-interface"; import { Shape } from "./components/badge/badge"; import { BannerAlign, BannerVariant, ButtonClose, Context } from "./components/banner/banner"; import { targets } from "./components/banner/banner-link/banner-link"; import { ButtonJustifyContent, ButtonSize, ButtonType, ButtonVariant, IconTheme, IconType } from "./components/button/button"; import { colorsVariants, LoadingSpinnerVariant } from "./components/loading-spinner/loading-spinner"; import { ButtonSize as ButtonSize1 } from "./components/button/button"; import { alignItems, breakpoint, direction, flexWrap, gap as gap1, justifyContent as justifyContent2, margin, padding } from "./components/grid/grid-interface"; import { ButtonIconTheme, IconButtonSize, IconButtonVariant } from "./components/icon-button/icon-button"; import { BorderColor, PaperBackground, PaperElevation } from "./components/paper/paper-interface"; import { justifyContent } from "./components/card/card-footer/card-footer"; import { justifyContent as justifyContent1 } from "./components/card/card-header/card-header"; import { arrows, bullets, bulletsPositions, gap } from "./components/carousel/carousel-interface"; import { Themes } from "./components/theme-provider/theme-provider"; import { ChipSize, ChipVariant } from "./components/chip/chip"; import { ColorChipClickable, Size } from "./components/chip-clickable/chip-clickable"; import { ColorChipSelected, Size as Size1 } from "./components/chip-selected/chip-selected"; import { ColorChipTag } from "./components/chip-tag/chip-tag"; import { CounterTextRule } from "./components/counter-text/counter-text-interface"; import { DropdownPostionType, typeDate } from "./components/datepicker/datepicker"; import { BannerVariant as BannerVariant1 } from "./components/banner/banner"; import { languages as languages1 } from "./utils/languages"; import { DaysList } from "./components/datepicker/datepicker-interface"; import { stateSelect } from "./components/datepicker/datepicker-period/datepicker-period"; import { activeMode, DropdownPostionType as DropdownPostionType1 } from "./components/dropdown/dropdown"; import { Color } from "./components/grid/color-grid-interface"; import { IconSize, IconTheme as IconTheme1, IconType as IconType1 } from "./components/icon/icon-interface"; import { IllustrationType } from "./components/illustration/illustration-interface"; import { ObjectFitValue } from "./components/image/image"; import { InputAutocapitalize, InputAutoComplete, InputCounterLengthRules, InputType } from "./components/input/input-interface"; import { InputChipsTypes } from "./components/input-chips/input-chips-interface"; import { InputEditableEventDetail, SizeInputEditable } from "./components/input-editable/input-editable"; import { Option, SelectChangeEvent, SelectChangeEventDetail, SelectOptionsPositionType } from "./components/selects/select-interface"; import { languages as languages2 } from "./components/input-phone-number/input-phone-number"; import { TypeList } from "./components/list/list"; import { Data } from "./components/list/list-interface"; import { TypeList as TypeList1 } from "./components/list/list"; import { ItemSize } from "./components/list/list-item"; import { loadingBarSize } from "./components/loading-bar/loading-bar"; import { colorsVariants as colorsVariants1, loadingSize, LoadingSpinnerVariant as LoadingSpinnerVariant1 } from "./components/loading-spinner/loading-spinner"; import { menuPosition } from "./components/menu/menu"; import { avatarSize as avatarSize2 } from "./components/menu/menu-exibition/menu-exibition"; import { sizes } from "./components/modal/modal"; import { collapses as collapses1 } from "./components/nav-tree/nav-tree"; import { collapses as collapses2 } from "./components/nav-tree/nav-tree-group"; import { collapses as collapses3 } from "./components/nav-tree/nav-tree-item"; import { justifyContent as justifyContent3, navbarBackground, orientation } from "./components/navbar/navbar"; import { PaginationOptionsPositionType } from "./components/pagination/pagination"; import { progressBarColor, progressBarSize } from "./components/progress-bar/progress-bar"; import { languages as languages3 } from "./components/rict-text/rich-text-interface"; import { positionBar } from "./components/rict-text/rich-text"; import { TypeOption } from "./components/select-option/select-option"; import { sidebarBackground, sidebarPosition, sidebarType } from "./components/sidebar/sidebar"; import { Shape as Shape1 } from "./components/skeleton/skeleton"; import { StepOption, typeRange } from "./components/slider/slider-interface"; import { SwitchSize } from "./components/switch/switch"; import { JustifyContent } from "./components/table/table-cell/table-cell"; import { JustifyContent as JustifyContent1 } from "./components/table/table-header-cell/table-header-cell"; import { Overflow } from "./components/tabs/tab (depreciated)/tabs-interface"; import { Themes as Themes1 } from "./components/theme-provider/theme-provider"; import { ActionType, ButtonActionType, CreateToastType, PositionType, VariantType } from "./components/toast/toast-interface"; import { TooltipPostionType } from "./components/tooltip/tooltip"; import { Bold, FontLineHeight, FontSize, Tag } from "./components/typo/typo"; import { languages as languages4 } from "./components/upload/languages"; export namespace Components { interface BdsAccordion { "close": () => Promise; "divisor"?: boolean; "notStart": () => Promise; "open": () => Promise; "reciveNumber": (number: any) => Promise; "startOpen"?: boolean; "toggle": () => Promise; } interface BdsAccordionBody { "close": () => Promise; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; "divisor": (valor: any) => Promise; "open": () => Promise; "toggle": () => Promise; } interface BdsAccordionGroup { "closeAll": (actNumber?: any) => Promise; "collapse"?: collapses; "divisor"?: boolean; "openAll": (actNumber?: any) => Promise; } interface BdsAccordionHeader { /** * Accordion Title. Used to add title in header accordion. */ "accordionTitle"?: string; /** * Avatar Name. Used to add avatar in header accordion. */ "avatarName"?: string; /** * Avatar Thumb. Used to add avatar in header accordion. */ "avatarThumb"?: string; "close": () => Promise; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * Icon. Used to add icon in header accordion. */ "icon"?: string; /** * Icon color. Used to set the color of icons in the accordion header. */ "iconColor"?: string; "open": () => Promise; "toggle": () => Promise; } interface BdsAlert { /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * Used to open/close the alert */ "open"?: boolean; /** * Define whether the component will occupy the entire screen or just the parent. */ "position"?: string; /** * Can be used outside to open/close the alert */ "toggle": () => Promise; } interface BdsAlertActions { } interface BdsAlertBody { } interface BdsAlertHeader { /** * used for add icon the header. Uses the bds-icon component. */ "icon"?: string; /** * Variant. Entered as one of the variant. Can be one of: 'system', 'error', 'warning', 'delete'; */ "variant"?: AlertHeaderVariannt; } interface BdsAutocomplete { "cleanMultipleSelection": () => Promise; /** * If true, the X icon will appear only when component is focused. */ "clearIconOnFocus"?: boolean; /** * Add state danger on input, use for use feedback. */ "danger"?: boolean; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * Disabled input. */ "disabled"?: boolean; /** * Indicated to pass an feeback to user. */ "errorMessage"?: string; /** * Indicated to pass a help the user in complex filling. */ "helperMessage"?: string; /** * used for add icon in input left. Uses the bds-icon component. */ "icon"?: string; /** * label in input, with he the input size increases. */ "label"?: string; /** * Language. Can be one of: 'pt_BR', 'es_ES', 'en_US'. */ "language"?: languages; /** * Is Loading, is the prop to enable that the component is loading. */ "loading"?: boolean; /** * The options of the select Should be passed this way: options='[{"value": "Cat", "label": "Meow"}, {"value": "Dog", "label": "Woof"}]' Options can also be passed as child by using bds-select-option component, but passing as a child you may have some compatibility problems with Angular. */ "options"?: string | AutocompleteOption[]; /** * Set the placement of the options menu. Can be 'bottom' or 'top'. */ "optionsPosition"?: AutocompleteOptionsPositionType; /** * Placeholder for native input element. */ "placeholder"?: string; /** * Search only the title property */ "searchOnlyTitle"?: boolean; /** * the item selected. */ "selected"?: HTMLBdsSelectOptionElement | null; /** * Selection Title, Prop to enable title to select. */ "selectedAll"?: boolean; /** * Selection Title, Prop to enable title to select. */ "selectionTitle"?: string; /** * Multiselect, Prop to enable multi selections. */ "selectionType"?: SelectionType; /** * Add state success on input, use for use feedback. */ "success"?: boolean; /** * Indicated to pass an feeback to user. */ "successMessage"?: string; /** * the value of the select. */ "value"?: string | null; } interface BdsAvatar { /** * Color, Entered as one of the color. Can be one of: 'system', 'success', 'warning', 'error', 'info'. */ "color"?: colors; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * Ellipses, serves to indicate the user number in the listing. */ "ellipsis"?: number; /** * Name, Inserted for highlighted osuary name. Enter the full name. */ "name"?: string; /** * When set to true, allows the avatar to be clicked to select and upload an image. */ "openUpload"?: boolean; /** * Size, Entered as one of the size. Can be one of: 'extra-small', 'small', 'standard', 'large', 'extra-large'. */ "size"?: avatarSize; /** * Thumbnail, Inserted to highlight user image. Url field. */ "thumbnail"?: string; /** * Upload, Serve to enable upload function on avatar. */ "upload"?: boolean; } interface BdsAvatarGroup { "canClick"?: boolean; /** * Size. Entered as one of the size. Can be one of: 'extra-small', 'small', 'standard', 'large', 'extra-large'. */ "size"?: avatarSize; /** * The users of the select Should be passed this way: users='[ {"id": "1", "name": "Michael Scott", "thumbnail": "https://gcdn.pbrd.co/images/9Kt8iMvR10Lf.jpg?o=1"}, {"id": "2", "name": "Dwight Schrute", "thumbnail": "https://gcdn.pbrd.co/images/XAlbTPDwjZ2d.jpg?o=1"}, {"id": "3", "name": "Jim Halpert", "thumbnail": "https://gcdn.pbrd.co/images/tK0Ygb0KAHUm.jpg?o=1"}, {"id": "4", "name": "Pam Beesly", "thumbnail": "https://gcdn.pbrd.co/images/8NZSnCGfB9BD.jpg?o=1"}, {"id": "5", "name": "Ryan Howard", "thumbnail": "https://gcdn.pbrd.co/images/6wwIWI1EzzVq.jpg?o=1"}, {"id": "6", "name": "Andy Bernard", "thumbnail": "https://gcdn.pbrd.co/images/5dPYFWixftY4.jpg?o=1"} ]' users can also be passed as child by using bds-avatar-group component, but passing as a child you may have some compatibility problems with Angular. */ "users"?: string | AvatarDataList[]; } interface BdsBadge { /** * If true, actived the pulse animation. */ "animation"?: boolean; /** * Set the color of the component. */ "color"?: string; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * Set witch icon will be render inside the component. */ "icon"?: string; /** * Set the text in shape circle. Is just alow numbers, but if the number pass 999 a symbol '+' will be render. */ "number"?: number; /** * Set the shape of the component. */ "shape"?: Shape; } interface BdsBanner { /** * Set the banner aligment, it can be one of: 'center', 'right' or 'left'. */ "bannerAlign"?: BannerAlign; /** * Set if show up the close button. */ "buttonClose"?: ButtonClose; /** * Set if the banner is external or internal. */ "context"?: Context; /** * Data test is the prop to specifically test the component action object. dtButtonClose is the data-test to button close. */ "dtButtonClose"?: string; "toggle": () => Promise; /** * Set the banner varient, it can be 'system' or 'warning'. */ "variant"?: BannerVariant; } interface BdsBannerLink { /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * Set the link pass. */ "link": string; /** * Set the link pass. */ "target": targets; } interface BdsBreadcrumb { "items": string | Array<{ label: string; href?: string }>; "wrapItems": boolean; } interface BdsButton { /** * The arrow button */ "arrow"?: boolean; /** * If true, shows the loading spinner */ "bdsLoading"?: boolean; /** * If not empty, Sets the color of the spinner, can be 'primary','secondary' or 'ghost' */ "bdsLoadingColor"?: colorsVariants; /** * If not empty, Sets the color of the spinner, can be 'primary','secondary' or 'ghost' */ "bdsLoadingVariant"?: LoadingSpinnerVariant; /** * If true, the base button will be disabled. */ "block"?: boolean; "color"?: string; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * If true, the base button will be disabled. */ "disabled"?: boolean; /** * If true, the button will occupy 100% width with centered content. */ "fullWidth"?: boolean; /** * If true, groups the left icon with the label when justifyContent is 'space-between'. This keeps the left icon and text together as a single visual unit on the left side. */ "groupIcon"?: boolean; /** * used for add icon in input left. Uses the bds-icon component. */ "icon"?: string; /** * used for add icon in input left. Uses the bds-icon component. */ "iconLeft"?: string; /** * used for add icon in input left. Uses the bds-icon component. */ "iconRight"?: string; /** * The theme of the icon. Can be one of: 'outline', 'solid'; */ "iconTheme": IconTheme; "isActive": (value: any) => Promise; /** * Controls the horizontal alignment of button content. 'center' - content is centered (default) 'space-between' - left content aligned left, right content aligned right */ "justifyContent"?: ButtonJustifyContent; "setColor": (color: 'primary' | 'content' | 'negative' | 'positive') => Promise; "setDirection": (direction: 'row' | 'column') => Promise; "setPosition": (position: 'first' | 'last' | 'middle') => Promise; "setSize": (size: ButtonSize) => Promise; "setVariant": (variant: ButtonVariant) => Promise; /** * Size. Entered as one of the size. Can be one of: 'tall', 'standard', 'short'; */ "size"?: ButtonSize; /** * The type of the button. Can be one of: 'button', 'submit', 'reset'; */ "type": ButtonType; /** * The type of the icon. Can be one of: 'icon', 'logo', 'emoji'; */ "typeIcon": IconType; /** * Variant. Entered as one of the variant. Can be one of: 'primary', 'secondary', 'ghost', 'dashed'; */ "variant"?: ButtonVariant; } interface BdsButtonGroup { "activateButton": (index: number) => Promise; /** * Color scheme for the buttons. Default is 'primary'. */ "color"?: string; /** * Direction of the button group layout. Can be one of: 'row', 'column'. */ "direction"?: direction; /** * Allows multiple buttons to be selected simultaneously if true. */ "multiple"?: boolean; /** * Size of the buttons. Can be one of: 'medium', 'large'. */ "size"?: ButtonSize1; } interface BdsButtonIcon { /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * If true, the base button will be disabled. */ "disabled"?: boolean; /** * used for add icon in input left. Uses the bds-icon component. */ "icon"?: string; /** * The theme of the icon. Can be one of: 'outline', 'solid'; */ "iconTheme": ButtonIconTheme; /** * Size. Entered as one of the size. Can be one of: 'tall', 'standard', 'short'; */ "size"?: IconButtonSize; /** * Variant. Entered as one of the variant. Can be one of: 'primary', 'secondary', 'ghost', 'dashed'; */ "variant"?: IconButtonVariant; } interface BdsCard { /** * Prop for set the background color. */ "bgColor"?: PaperBackground; /** * Prop for set the border color. */ "borderColor"?: BorderColor; /** * If the prop is true, the component will be clickable. */ "clickable"?: boolean; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * Prop for set the height of the component. */ "height"?: string; /** * Prop for set the background color. */ "selectable"?: boolean; /** * Prop for set the width of the component. */ "width"?: string; } interface BdsCardBody { } interface BdsCardColor { /** * Specifies if the hex is a linear gradient */ "gradient": boolean; /** * Specifies HEX color, use Figma docs in Blip DS. */ "hex"?: string; /** * If true, the text will be white */ "lightText": boolean; /** * Specifies name color, use Figma docs in Blip DS. */ "name": string; /** * Specifies variabel sass color, _variables.scss. */ "variable": string; } interface BdsCardFooter { /** * Prop for internal elements alignment. Will follow the same values of css. */ "align"?: justifyContent; } interface BdsCardHeader { /** * Prop for internal elements alignment. Will follow the same values of css. */ "align"?: justifyContent; } interface BdsCardSubtitle { /** * Set the card subtitle. */ "text"?: string; } interface BdsCardTitle { /** * Set the card title. */ "text"?: string; } interface BdsCarousel { /** * arrows. Prop to select type of arrows in component. Are available "outside" | "inside" | "none". */ "arrows"?: arrows; /** * autoHeight. Prop to Enable it if you want the component to adjust its height relative to the active items.. */ "autoHeight"?: boolean; /** * Autoplay. Prop to Enable component autoplay. */ "autoplay"?: boolean; /** * AutoplayHoverPause. Prop to Enable it if you will have the function to pause autoplay when on hover. */ "autoplayHoverPause"?: boolean; /** * AutoplayTimeout. Prop to Choose the Autoplay time in milliseconds, ex: 5000. */ "autoplayTimeout"?: number; "buildCarousel": () => Promise; /** * Bullet. Prop to Enable component bullets navigation. */ "bullets"?: boolean | bullets; /** * Bullet. Prop to Enable component bullets navigation. */ "bulletsPosition"?: bulletsPositions; /** * Data test is the prop to specifically test the component action object. dtButtonNext is the data-test to button next. */ "dtButtonNext"?: string; /** * Data test is the prop to specifically test the component action object. dtButtonPrev is the data-test to button prev. */ "dtButtonPrev"?: string; /** * Data test is the prop to specifically test the component action object. dtSlideContent is the data-test to slide action. */ "dtSlideContent"?: string; /** * Gap. Prop to Select the gap distance between items. */ "gap"?: gap; /** * Grab. Prop to enable function of grab in carousel. */ "grab"?: boolean; /** * InfiniteLoop. Prop to Enable if the component will have infinite loop. */ "infiniteLoop"?: boolean; /** * Loading state. Indicates if the component is in a loading state. */ "loading"?: boolean; "nextSlide": () => Promise; "pauseAutoplay": () => Promise; "prevSlide": () => Promise; "runAutoplay": () => Promise; "setActivated": (item: number) => Promise; /** * SlidePerPage. Prop to Choose the number of slide per page you will have available in the carousel. */ "slidePerPage"?: number; } interface BdsCarouselItem { "bgColor"?: string; "bgImage"?: string; "bgImageBrightness"?: number; /** * Set what theme will be aplyed inside the component. 'light', 'dark'; */ "theme"?: Themes; } interface BdsCheckbox { /** * If `true`, the checkbox is selected. */ "checked": boolean; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * If `true`, the user cannot interact with the checkbox. */ "disabled": boolean; "getInputElement": () => Promise; "getValue": () => Promise; /** * If `true`, the checkbox is in an indeterminate state. This is used when the checkbox is a parent of a list of checkboxes and some (but not all) of the child checkboxes are selected. Clicking when indeterminate will set the checkbox to checked. */ "indeterminate": boolean; "label": string; /** * The name of the control, which is submitted with the form data. */ "name": string; "refer": string; "toggle": () => Promise; } interface BdsChip { /** * When 'true' and the component is using the primary variant, a hover is added */ "clickable": boolean; /** * Add state danger on chip, use for use feedback. */ "danger"?: boolean; /** * When 'true', the component recive remove button and dispach event onBdsDelete */ "deletable": boolean; /** * When 'true', no events will be dispatched */ "disabled": boolean; /** * Add state filter on chip whith specific color. */ "filter": boolean; /** * used for add icon in left container. Uses the bds-icon component. */ "icon"?: string; /** * Chip size. Entered as one of the size design tokens. Can be one of: "standard" and "tall" */ "size"?: ChipSize; /** * Variant. Entered as one of the variant. Can be one of: 'primary', 'default'; */ "variant"?: ChipVariant; } interface BdsChipClickable { /** * used for add avatar left container. Uses the bds-avatar component. */ "avatar"?: string; /** * it makes the chip clickable. */ "clickable"?: boolean; /** * used for delete the chip. */ "close"?: boolean; /** * used for change the color. Uses one of them. */ "color"?: ColorChipClickable; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * the chip gone stay disabled while this prop be true. */ "disabled"?: boolean; /** * Data test is the prop to specifically test the component action object. dtButtonClose is the data-test to button close. */ "dtButtonClose"?: string; /** * used for add icon in left container. Uses the bds-icon component. */ "icon"?: string; /** * used for change the size chip. Uses one of them. */ "size"?: Size; } interface BdsChipSelected { /** * used for change the color. Uses one of them. */ "color"?: ColorChipSelected; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * When 'true', no events will be dispatched */ "disabled"?: boolean; /** * used for add icon in left container. Uses the bds-icon component. */ "icon"?: string; /** * used for set the initial setup for true; */ "selected"?: boolean; /** * used for change the chip size. Use one of them; */ "size"?: Size; } interface BdsChipTag { /** * used for change the color. Uses one of them. */ "color"?: ColorChipTag; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * used for add icon in left container. Uses the bds-icon component. */ "icon"?: string; } interface BdsCounterText { "active"?: boolean; "delete"?: CounterTextRule; "length": number; "max"?: number; "warning"?: CounterTextRule; } interface BdsDataTable { /** * Prop to activate the possibility of use chip in any column. */ "actionArea"?: boolean; /** * Prop to activate the possibility of use avatar in any column. */ "avatar"?: boolean; /** * Prop to activate the possibility of use chip in any column. */ "chips"?: boolean; /** * Prop to recive the header and configuration of table. */ "column"?: string; "deleteItem": (index: number) => Promise; /** * Prop to recive the content of the table. */ "options"?: string; /** * Prop to activate the sorting. */ "sorting"?: boolean; } interface BdsDatepicker { /** * Disabled input. */ "disabled"?: boolean; /** * Data test is the prop to specifically test the component action object. dtButtonClear is the data-test to button clear. */ "dtButtonClear"?: string; /** * Data test is the prop to specifically test the component action object. dtButtonConfirm is the data-test to button confirm. */ "dtButtonConfirm"?: string; /** * Data test is the prop to specifically test the component action object. dtButtonNext is the data-test to button next. */ "dtButtonNext"?: string; /** * Data test is the prop to specifically test the component action object. dtButtonPrev is the data-test to button prev. */ "dtButtonPrev"?: string; /** * Data test is the prop to specifically test the component action object. dtInputEnd is the data-test to input end. */ "dtInputEnd"?: string; /** * Data test is the prop to specifically test the component action object. dtInputStart is the data-test to input start. */ "dtInputStart"?: string; /** * Data test is the prop to specifically test the component action object. dtOutzone is the data-test to outzone. */ "dtOutzone"?: string; /** * Data test is the prop to specifically test the component action object. dtSelectMonth is the data-test to select month. */ "dtSelectMonth"?: string; /** * Data test is the prop to specifically test the component action object. dtSelectYear is the data-test to select year. */ "dtSelectYear"?: string; /** * EndDateLimit. Insert a limiter to select the date period. */ "endDateLimit"?: string; /** * label in input, with he the input size increases. */ "label"?: string; /** * Language, Entered as one of the languages. Can be one of: 'pt_BR', 'es_ES', 'en_US'. */ "language"?: languages1; /** * Message. Select type of date. */ "message"?: string; /** * Used to set drop position */ "positionOptions"?: DropdownPostionType; /** * StartDateLimit. Insert a limiter to select the date period. */ "startDateLimit"?: string; /** * TypeOfDate. Select type of date. */ "typeOfDate"?: typeDate; /** * Default value input. */ "valueDateSelected"?: string; /** * Default value input. */ "valueEndDateSelected"?: string; /** * Message. Select type of date. */ "variantBanner"?: BannerVariant1; } interface BdsDatepickerPeriod { /** * Return the validity of the input. */ "clear": () => Promise; /** * Data test is the prop to specifically test the component action object. dtButtonNext is the data-test to button next. */ "dtButtonNext"?: string; /** * Data test is the prop to specifically test the component action object. dtButtonPrev is the data-test to button prev. */ "dtButtonPrev"?: string; /** * Data test is the prop to specifically test the component action object. dtSelectMonth is the data-test to select month. */ "dtSelectMonth"?: string; /** * Data test is the prop to specifically test the component action object. dtSelectYear is the data-test to select year. */ "dtSelectYear"?: string; /** * EndDate. Insert a limiter to select the date period. */ "endDate"?: DaysList; /** * EndDateSelect. Insert a limiter to select the date period. */ "endDateSelect"?: Date; /** * Language, Entered as one of the languages. Can be one of: 'pt_BR', 'es_ES', 'en_US'. */ "language"?: languages1; /** * StartDate. Insert a limiter to select the date period. */ "startDate"?: DaysList; /** * StartDateSelect. Insert a limiter to select the date period. */ "startDateSelect"?: Date; /** * EndDateSelect. Insert a limiter to select the date period. */ "stateSelect"?: stateSelect; } interface BdsDatepickerSingle { /** * Return the validity of the input. */ "clear": () => Promise; /** * dateSelect. Insert a limiter to select the date period. */ "dateSelect"?: Date; /** * Data test is the prop to specifically test the component action object. dtButtonNext is the data-test to button next. */ "dtButtonNext"?: string; /** * Data test is the prop to specifically test the component action object. dtButtonPrev is the data-test to button prev. */ "dtButtonPrev"?: string; /** * Data test is the prop to specifically test the component action object. dtSelectMonth is the data-test to select month. */ "dtSelectMonth"?: string; /** * Data test is the prop to specifically test the component action object. dtSelectYear is the data-test to select year. */ "dtSelectYear"?: string; /** * EndDate. Insert a limiter to select the date period. */ "endDate"?: DaysList; /** * Language, Entered as one of the languages. Can be one of: 'pt_BR', 'es_ES', 'en_US'. */ "language"?: languages1; /** * StartDate. Insert a limiter to select the date period. */ "startDate"?: DaysList; } interface BdsDivider { /** * Cor da linha, aceitando qualquer valor válido em CSS (hex, rgb, nome da cor) */ "color": 'divider-1' | 'divider-2' | 'divider-3'; /** * Define se o divider deve ser exibido horizontalmente ou verticalmente */ "orientation": 'horizontal' | 'vertical'; /** * O tipo de estilo da linha: sólida, pontilhada, tracejada */ "styleType": 'solid' | 'dotted' | 'dashed'; } interface BdsDropdown { /** * Open. Used to open/close the dropdown. */ "activeMode"?: activeMode; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * Open. Used to open/close the dropdown. */ "open"?: boolean; /** * Used to set drop position */ "position"?: DropdownPostionType; "setClose": () => Promise; "setOpen": () => Promise; "toggle": () => Promise; } interface BdsExpansionPanel { } interface BdsExpansionPanelBody { "open"?: boolean; "text"?: string; } interface BdsExpansionPanelHeader { "text"?: string; } interface BdsGrid { "alignItems"?: alignItems; "bgColor"?: Color; "container"?: boolean; "containerFluid"?: boolean; "direction"?: direction; "flexWrap"?: flexWrap; "gap"?: gap1; "height"?: string; "justifyContent"?: justifyContent2; "lg"?: breakpoint; "lgOffset"?: breakpoint; "margin"?: margin; "md"?: breakpoint; "mdOffset"?: breakpoint; "padding"?: padding; "sm"?: breakpoint; "smOffset"?: breakpoint; "xg"?: breakpoint; "xgOffset"?: breakpoint; "xs"?: breakpoint; "xsOffset"?: breakpoint; "xxs"?: breakpoint; "xxsOffset"?: breakpoint; } interface BdsIcon { /** * Specifies the label to use for accessibility. Defaults to the icon name. */ "ariaLabel": string; /** * Specifies the color to use.Specifies a color to use. The default is svg. */ "color"?: string; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * Specifies whether the icon should horizontally flip when `dir` is `"rtl"`. */ "flipRtl"?: boolean; /** * A combination of both `name` and `src`. If a `src` url is detected it will set the `src` property. Otherwise it assumes it's a built-in named SVG and set the `name` property. */ "icon"?: any; /** * If enabled, ion-icon will be loaded lazily when it's visible in the viewport. Default, `false`. */ "lazy": boolean; /** * Specifies which icon to use from the built-in set of icons. */ "name"?: string; /** * Icon size. Entered as one of the icon size design tokens. Can be one of: "xxx-small", "xx-small", "x-small", "small", "medium", "large", "x-large", "xx-large", "xxx-large", "brand". */ "size"?: IconSize; /** * Specifies the exact `src` of an SVG file to use. */ "src"?: string; /** * Specifies the theme to use outline or solid icons. Defaults to outline. */ "theme": IconTheme1; /** * Specifies the type of icon. If type is set to emoji, it will be able to set only emoji names on the name property. */ "type": IconType1; } interface BdsIllustration { /** * Alternative text for the image. */ "alt"?: string; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * Specifies the name of illustration. Verify the names on illustration tokens. */ "name": string; /** * Specifies the type to use. Can be: 'default'. */ "type": IllustrationType; } interface BdsImage { /** * Alternative text for the image. */ "alt"?: string; /** * Brightness of the image. */ "brightness"?: number; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * Height of the image. */ "height"?: string; "loadImage": () => Promise; /** * Specifies the object-fit style for the image. Can be: 'fill', 'contain', 'cover', 'none', 'scale-down'. */ "objectFit"?: ObjectFitValue; /** * URL of the main image. */ "src"?: string; /** * Width of the image. */ "width"?: string; } interface BdsInput { /** * Defines automatic text capitalization (possible values: `on`, `off`). */ "autoCapitalize"?: InputAutocapitalize; /** * Defines browser autocomplete behavior (possible values: `on`, `off`). */ "autoComplete"?: InputAutoComplete; /** * Defines whether the textarea should automatically resize based on content. */ "autoResize": boolean; /** * Defines if the input will be displayed as chips (a type of input with multiple values). */ "chips": boolean; /** * Clears the input field value. */ "clear": () => Promise; /** * Defines the number of columns for the textarea (if `textarea`). */ "cols"?: number; /** * Defines whether a character length counter will be displayed. */ "counterLength"?: boolean; /** * Defines the character length counter rule (min, max, etc). */ "counterLengthRule"?: InputCounterLengthRules; /** * Defines if the input is in error state. */ "danger"?: boolean; /** * Data test is the prop to specifically test the component action. */ "dataTest"?: string; /** * Defines the debounce delay in milliseconds for textarea auto-resize. */ "debounceDelay"?: number; /** * Defines if the input is disabled. */ "disabled"?: boolean; /** * Error message displayed when the input value is not a valid email. */ "emailErrorMessage": string; "encode"?: boolean; /** * Error message displayed when the input value is invalid. */ "errorMessage"?: string; /** * Returns the input element of the component. */ "getInputElement": () => Promise; /** * Help message displayed below the input. */ "helperMessage"?: string; /** * Name of the icon to be displayed inside the input. */ "icon"?: string; /** * Defines the icon size (small or medium). */ "iconSize"?: 'small' | 'medium'; /** * Input name, used for form identification. */ "inputName"?: string; /** * Defines whether the input will be submitted when pressing Enter. */ "isSubmit": boolean; /** * Defines whether the input is a textarea. */ "isTextarea": boolean; /** * Checks if the input field is valid. */ "isValid": () => Promise; /** * Label to be displayed above the input. */ "label"?: string; /** * Defines the maximum allowed value for the input. */ "max"?: string; /** * Error message displayed when the input value doesn't meet the maximum allowed value. */ "maxErrorMessage": string; /** * Defines the maximum height of the textarea in pixels. */ "maxHeight"?: number; /** * Defines the maximum number of characters allowed in the input. */ "maxlength"?: number; /** * Defines the minimum allowed value for the input. */ "min"?: string; /** * Error message displayed when the input value doesn't meet the minimum allowed value. */ "minErrorMessage": string; /** * Defines the minimum height of the textarea in pixels. */ "minHeight"?: number; /** * Defines the minimum number of characters allowed in the input. */ "minlength"?: number; /** * Error message displayed when the input value doesn't meet the minimum length requirement. */ "minlengthErrorMessage": string; /** * Error message displayed when the input value is not a valid number. */ "numberErrorMessage": string; /** * Defines a regex pattern that the input value must follow. */ "pattern"?: string; /** * Text to be displayed as a hint or placeholder in the input. */ "placeholder"?: string; /** * Makes the input read-only. */ "readonly": boolean; /** * Removes focus from the input field. */ "removeFocus": () => Promise; /** * Defines if the input is required. */ "required": boolean; /** * Error message displayed when the input is not filled and is required. */ "requiredErrorMessage": string; /** * Defines whether the textarea can be manually resized by the user. */ "resizable": boolean; /** * Defines the number of lines for the textarea (if `textarea`). */ "rows"?: number; /** * Sets focus to the input field. */ "setFocus": () => Promise; /** * Defines if the input is in success state. */ "success"?: boolean; /** * Message displayed when the input value is valid. */ "successMessage"?: string; /** * Defines the input type (e.g., `text`, `password`, etc). */ "type"?: InputType; /** * The current value of the input. */ "value"?: string | null; } interface BdsInputChips { "add": (value: string) => Promise; /** * When true, the press enter will be simulated on blur event. */ "blurCreation": boolean; /** * The chips on the component Should be passed this way: chips='["chip1", "chip2"]' */ "chips": string[] | string; /** * Clear all chips */ "clear": () => Promise; /** * Passing true to display a counter of available size, it is necessary to pass another maxlength property. */ "counterLength"?: boolean; /** * Add state danger on input, use for use feedback. */ "danger"?: boolean; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * The delimiter is used to add multiple chips in the same string. */ "delimiters"?: RegExp; /** * If `true`, the user cannot modify the value. */ "disableSubmit": boolean; /** * Disabled input */ "disabled"?: boolean; /** * Data test is the prop to specifically test the component action object. dtButtonClose is the data-test to button close. */ "dtButtonClose"?: string; /** * Do not accept duplicate chip elements. */ "duplicated"?: boolean; /** * Indicated to pass an feedback to user. */ "errorMessage"?: string; /** * Return the chips */ "get": () => Promise; /** * Prop for set the height of the component. */ "height"?: string; /** * Indicated to pass a help the user in complex filling. */ "helperMessage"?: string; /** * used for add icon in input left. Uses the bds-icon component. */ "icon"?: string; /** * Prop to insert the name of the input */ "inputName"?: string; /** * Return the validity of the input chips. */ "isValid": () => Promise; /** * label in input, with he the input size increases. */ "label"?: string; /** * Set maximum length value for chips */ "maxChipsLength"?: number; /** * Prop for set the max height of the component. */ "maxHeight"?: string; /** * Set maximum length value for the chip content */ "maxlength"?: number; /** * A tip for the user who can enter no controls. */ "placeholder"?: string; "removeFocus": () => Promise; "setFocus": () => Promise; /** * Add state success on input, use for use feedback. */ "success"?: boolean; /** * Indicated to pass an feeback to user. */ "successMessage"?: string; /** * Defining the type is important so that it is possible to carry out validations. Can be one of: 'text' and 'email; */ "type": InputChipsTypes; /** * The value of the input. */ "value"?: string | null; } interface BdsInputEditable { /** * Add state danger on input, use for use feedback. If true avoid save confirmation. */ "danger"?: boolean; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * Data test is the prop to specifically test the component action object. dtButtonClose is the data-test to button close. */ "dtButtonClose"?: string; /** * Data test is the prop to specifically test the component action object. dtButtonConfirm is the data-test to button confirm. */ "dtButtonConfirm"?: string; /** * Data test is the prop to specifically test the component action object. dtButtonEdit is the data-test to button edit. */ "dtButtonEdit"?: string; /** * Indicated to pass an feeback to user. */ "errorMessage"?: string; /** * Defines whether the component will be expandable */ "expand"?: boolean; /** * Indicated to pass a help to the user in complex filling. */ "helperMessage"?: string; /** * Input Name */ "inputName"?: string; /** * If the value of the type attribute is `text`, `email`, `search`, `password`, `tel`, or `url`, this attribute specifies the maximum number of characters that the user can enter. */ "maxlength"?: number; /** * If the value of the type attribute is `text`, `email`, `search`, `password`, `tel`, or `url`, this attribute specifies the minimum number of characters that the user can enter. */ "minlength"?: number; /** * Error message when the value is lower than the minlength */ "minlengthErrorMessage": string; /** * Placeholder for native input element. */ "placeholder"?: string; /** * Error message when input is required */ "requiredErrorMessage": string; /** * Set the component size. Can be one of: 'short' | 'standard' | 'tall'; */ "size"?: SizeInputEditable; /** * Add state success on input, use for use feedback. */ "success"?: boolean; /** * Indicated to pass an feeback to user. */ "successMessage"?: string; /** * The value of the input. */ "value"?: string | null; } interface BdsInputPassword { /** * Capitalizes every word's second character. */ "autoCapitalize"?: InputAutocapitalize; /** * Hint for form autofill feature */ "autoComplete"?: InputAutoComplete; /** * Add state danger on input, use for use feedback. */ "danger"?: boolean; /** * Data test is the prop to specifically test the component action object. */ "dataTest"?: string; /** * Disabled input. */ "disabled"?: boolean; /** * Indicated to pass an feeback to user. */ "errorMessage"?: string; /** * Indicated to pass a help the user in complex filling. */ "helperMessage"?: string; /** * used for add icon in input left. Uses the bds-icon component. */ "icon"?: string; /** * Input Name */ "inputName"?: string; /** * label in input, with he the input size increases. */ "label"?: string; /** * The maximum value, which must not be less than its minimum (min attribute) value. */ "max"?: string; /** * If the value of the type attribute is `text`, `email`, `search`, `password`, `tel`, or `url`, this attribute specifies the maximum number of characters that the user can enter. */ "maxlength"?: number; /** * The minimum value, which must not be greater than its maximum (max attribute) value. */ "min"?: string; /** * If the value of the type attribute is `text`, `email`, `search`, `password`, `tel`, or `url`, this attribute specifies the minimum number of characters that the user can enter. */ "minlength"?: number; "openEyes"?: boolean; /** * A tip for the user who can enter no controls. */ "placeholder"?: string; /** * If `true`, the user cannot modify the value. */ "readonly": boolean; /** * Add state success on input, use for use feedback. */ "success"?: boolean; /** * Indicated to pass an feeback to user. */ "successMessage"?: string; /** * The value of the input. */ "value"?: string | null; } interface BdsInputPhoneNumber { "changeCountry": (code: any, isoCode: any, flag: any) => Promise; /** * Habilita o estado "danger" no input. */ "danger"?: boolean; /** * Data-test para identificar o componente. */ "dataTest"?: string; /** * Desabilita o input. */ "disabled"?: boolean; /** * Data-test para o botão de seleção de bandeira. */ "dtSelectFlag"?: string; /** * Mensagem de erro a ser exibida. */ "errorMessage"?: string; /** * Mensagem de ajuda para o usuário. */ "helperMessage"?: string; /** * Ícone à esquerda do input. */ "icon"?: string; /** * Label do input. */ "label"?: string; /** * Valores possíveis: "pt_BR", "en_US", "es_ES". Se nenhum for informado, utiliza o arquivo padrão (countries.json). */ "language"?: languages; /** * Mensagem de erro para validação numérica. */ "numberErrorMessage": string; /** * Lista de opções do select. */ "options"?: Array