/* 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"; export namespace Components { interface FwButton { /** * Identifier of the theme based on which the button is styled. */ "color": "primary" | "secondary" | "danger" | "link" | "text"; /** * Disables the button on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled": boolean; /** * Sets the button to a full-width block. If the attribute’s value is undefined, the value is set to false. */ "expand": boolean; /** * Accepts the id of the fw-modal component to open it on click */ "modalTriggerId": string; /** * Size of the button. */ "size": "normal" | "mini" | "small"; /** * Button type based on which actions are performed when the button is clicked. */ "type": "button" | "reset" | "submit"; } interface FwCheckbox { /** * Sets the state of the check box to selected. If the attribute’s value is undefined, the value is set to false. */ "checked": boolean; /** * Disables the check box on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled": boolean; /** * Label displayed on the interface, for the check box. */ "label": string; /** * Name of the component, saved as part of form data. */ "name": string; /** * Identifier corresponding to the component, that is saved when the form data is saved. */ "value": string; } interface FwDatepicker { /** * Format in which the date values selected in the calendar are populated in the input box and saved when the form data is saved. */ "dateFormat": string; /** * Starting date of the date range that is preselected in the calendar, if mode is range. Must be a date later than the min-date value. */ "fromDate": string; /** * Latest date a user can select in the calendar, if mode is range. */ "maxDate": string; /** * Earliest date a user can select in the calendar, if mode is range. */ "minDate": string; /** * Type of date selection enabled for the calendar. If the value is range, a user can select a date range in the calendar. */ "mode": "single date" | "range"; /** * Name of the component, saved as part of form data. */ "name": string; /** * Text displayed in the input box before a user selects a date or date range. */ "placeholder": string; /** * Ending date of the date range that is preselected in the calendar, if mode is range. Must be a date earlier than the max-date value. */ "toDate": string; /** * Date that is preselected in the calendar, if mode is single date or undefined. */ "value": string; } interface FwDropdownButton { /** * Dropdown Button color */ "color": "primary" | "secondary" | "danger" | "link" | "text"; /** * Disables the dropdown button if its true */ "disabled": boolean; /** * Label for the dropdown button */ "label": string; /** * Options to show in the dropdown button */ "options": any[]; /** * Placeholder text for search input. Validated only if dropdown and searchable is true */ "placeholder": string; /** * Displays a searchable dropdown button */ "searchable": boolean; /** * Displays a split dropdown button */ "split": boolean; /** * Value of the dropdown button */ "value": any; } interface FwIcon { /** * Color in which the icon is displayed, specified as a standard CSS color or as a HEX code. */ "color": string; /** * Identifier of the icon. The attribute’s value must be a valid svg file in the repo of icons (assets/icons). */ "name": string; /** * Size of the icon, specified in number of pixels. */ "size": number; } interface FwInput { /** * Specifies whether the browser can display suggestions to autocomplete the text value. */ "autocomplete": "on" | "off"; /** * Specifies whether the browser can auto focus the input field */ "autofocus": boolean; /** * Displays a right-justified clear icon in the text box. Clicking the icon clears the input text. If the attribute’s value is undefined, the value is set to false. For a read-only input box, the clear icon is not displayed unless a default value is specified for the input box. */ "clearInput": boolean; /** * Disables the component on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled": boolean; /** * Identifier of the icon that is displayed in the left side of the text box. The attribute’s value must be a valid svg file in the repo of icons (assets/icons). */ "iconLeft": string; /** * Identifier of the icon that is displayed in the right side of the text box. The attribute’s value must be a valid svg file in the repo of icons (assets/icons). */ "iconRight": string; /** * Label displayed on the interface, for the component. */ "label": string; /** * Maximum number of characters a user can enter in the text box. */ "maxlength"?: number; /** * Minimum number of characters a user must enter in the text box for the value to be valid. */ "minlength"?: number; /** * Name of the component, saved as part of form data. */ "name": string; /** * Text displayed in the text box before a user enters a value. */ "placeholder"?: string | null; /** * If true, the user cannot enter a value in the input box. If the attribute’s value is undefined, the value is set to false. */ "readonly": boolean; /** * Specifies the input box as a mandatory field and displays an asterisk next to the label. If the attribute’s value is undefined, the value is set to false. */ "required": boolean; /** * Sets focus on a specific `fw-input`. Use this method instead of the global `input.focus()`. */ "setFocus": () => Promise; /** * Theme based on which the text box is styled. */ "state": "normal" | "warning" | "error"; /** * Descriptive or instructional text displayed below the text box. */ "stateText": string; /** * Type of value accepted as the input value. If a user enters a value other than the specified type, the input box is not populated. */ "type": "text" | "number"; /** * Default value displayed in the input box. */ "value"?: string | null; } interface FwLabel { /** * Theme based on which the label is styled. */ "color": "blue" | "red" | "green" | "yellow" | "grey" | "normal"; /** * Display text in the label. */ "value": string; } interface FwModal { /** * The text for the cancel button */ "cancelText": string; /** * Enable custom footer */ "customFooter": boolean; /** * The title text to be displayed on the modal */ "description": string; /** * Hides the footer */ "hideFooter": boolean; /** * The icon to be displayed with the title */ "icon": string; /** * Size of the modal */ "size": "standard" | "small" | "large"; /** * The text for the success button */ "successText": string; /** * The title text to be displayed on the modal */ "titleText": string; /** * Toggle the visibility of the modal */ "visible": boolean; } interface FwRadio { /** * Sets the state to selected. If the attribute’s value is undefined, the value is set to false. */ "checked": boolean; /** * Disables the component on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled": boolean; /** * Label displayed on the interface, for the component. */ "label": string; /** * Name of the component, saved as part of form data. */ "name": string; /** * Identifier corresponding to the component, that is saved when the form data is saved. */ "value": string; } interface FwRadioGroup { /** * If true, a radio group can be saved without selecting any option. If an option is selected, the selection can be cleared. If the attribute’s value is undefined, the value is set to false. */ "allowEmpty": boolean; /** * Name of the component, saved as part of form data. */ "name": string; /** * Default option that is selected when the radio group is displayed on the interface. Must be a valid value corresponding to the fw-radio components used in the Radio Group. */ "value"?: any | null; } interface FwSelect { /** * If true, the select component is auto focused on the page */ "autofocus": boolean; /** * Disables the component on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled": boolean; /** * If true, the user must select a value. The default value is not displayed. */ "forceSelect": boolean; "getSelectedItem": () => Promise; /** * Label displayed on the interface, for the component. */ "label": string; /** * Works with `multiple` enabled. Configures the maximum number of options that can be selected with a multi-select component. */ "max": number; /** * Enables selection of multiple options. If the attribute’s value is undefined, the value is set to false. */ "multiple": boolean; /** * Name of the component, saved as part of form data. */ "name": string; /** * Text displayed in the list box before an option is selected. */ "placeholder"?: string | null; /** * If true, the user cannot modify the default value selected. If the attribute's value is undefined, the value is set to true. */ "readonly": boolean; /** * Specifies the select field as a mandatory field and displays an asterisk next to the label. If the attribute’s value is undefined, the value is set to false. */ "required": boolean; "setSelectedValues": (values: string[]) => Promise; /** * Theme based on which the list box is styled. */ "state": "normal" | "warning" | "error"; /** * Descriptive or instructional text displayed below the list box. */ "stateText": string; /** * Type of option accepted as the input value. If a user tries to enter an option other than the specified type, the list is not populated. */ "type": "text" | "number"; /** * Value of the option that is displayed as the default selection, in the list box. Must be a valid value corresponding to the fw-select-option components used in Select. */ "value": any; } interface FwSelectOption { /** * Sets the state of the option to disabled. The selected option is disabled and greyed out. If the attribute’s value is undefined, the value is set to false. */ "disabled": boolean; /** * States that the option is an HTML value. If the attribute's value is undefined, the value is set to true. */ "html": boolean; /** * HTML content that is displayed as the option. */ "htmlContent"?: string; /** * Alternate text displayed on the interface, in place of the actual HTML content. */ "optionText": string; /** * Sets the state of the option to selected. The selected option is highlighted and a check mark is displayed next to it. If the attribute’s value is undefined, the value is set to false. */ "selected": boolean; /** * Value corresponding to the option, that is saved when the form data is saved. */ "value": string; } interface FwSpinner { /** * Color in which the loader is displayed, specified as a standard CSS color. */ "color": string; /** * Size of the loader. */ "size": "small" | "medium" | "large" | "default"; } interface FwTab { /** * Disables this tab */ "disabled": boolean; /** * Name of the tab displayed on the UI. */ "tabHeader": string; /** * HTML that can be rendered in tab header. */ "tabHeaderHtml": string; } interface FwTabs { /** * The index of the activated Tab(Starts from 0) */ "activeTabIndex": number; } interface FwTag { /** * Sets the state of the tag to disabled. The close button is disabled. If the attribute’s value is undefined, the value is set to false. */ "disabled": false; /** * Display text in the tag component. */ "text": string; /** * Value associated with the tag component, that is saved when the form data is saved. */ "value": string; } interface FwTextarea { /** * If true, the textarea is autofocused */ "autofocus": boolean; /** * Width of the input box, specified as number of columns. */ "cols"?: number; /** * Disables the text area on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled": boolean; /** * Label displayed on the interface, for the component. */ "label": string; /** * Maximum number of characters a user can enter in the input box. */ "maxlength"?: number; /** * Minimum number of characters a user must enter in the input box for the value to be valid. */ "minlength"?: number; /** * Name of the component, saved as part of form data. */ "name": string; /** * Text displayed in the input box before a user enters a value. */ "placeholder"?: string | null; /** * If true, the user cannot enter a value in the input box. If the attribute’s value is undefined, the value is set to false. */ "readonly": boolean; /** * Specifies the input box as a mandatory field and displays an asterisk next to the label. If the attribute’s value is undefined, the value is set to false. */ "required": boolean; /** * Height of the input box, specified as number of rows. */ "rows"?: number; /** * Sets focus on a specific `fw-textarea`. Use this method instead of the global `input.focus()`. */ "setFocus": () => Promise; /** * Theme based on which the input box is styled. */ "state": "normal" | "warning" | "error"; /** * Descriptive or instructional text displayed below the input box. */ "stateText": string; /** * Default value displayed in the input box. */ "value"?: string | null; /** * Type of text wrapping used by the input box. If the value is hard, the text in the textarea is wrapped (contains line breaks) when the form data is saved. If the value is soft, the text in the textarea is saved as a single line, when the form data is saved. */ "wrap": "soft" | "hard"; } interface FwTimepicker { /** * Set true to disable the element */ "disabled": boolean; /** * Format in which time values are populated in the list box. If the value is hh:mm p, the time values are in the 12-hour format. If the value is hh:mm, the time values are in the 24-hr format. */ "format": "hh:mm A" | "HH:mm"; /** * Time interval between the values displayed in the list, specified in minutes. */ "interval": number; /** * Upper time-limit for the values displayed in the list. If this attribute’s value is in the hh:mm format, it is assumed to be hh:mm AM. */ "maxTime"?: string; /** * Lower time-limit for the values displayed in the list. If this attribute’s value is in the hh:mm format, it is assumed to be hh:mm AM. */ "minTime"?: string; /** * Name of the component, saved as part of form data. */ "name": string; /** * Time output value */ "value"?: string; } interface FwToast { /** * The Content of the action link */ "actionLinkText": string; /** * The content to be diaplyed in toast */ "content": string; /** * Pause the toast from hiding on mouse hover */ "pauseOnHover": boolean; /** * position of the toast notification in screen */ "position": "top-center" | "top-left" | "top-right"; /** * won't close automatically */ "sticky": boolean; /** * Time duration of the toast visibility */ "timeout": number; "trigger": (configs: object) => Promise; /** * Type of the toast - success,failure, warning, inprogress */ "type": "success" | "error" | "warning" | "inprogress"; } interface FwToggle { /** * Sets the selected state as the default state. If the attribute’s value is undefined, the value is set to false. */ "checked": boolean; /** * Specifies whether to disable the control on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled": boolean; /** * Name of the component, saved as part of the form data. */ "name": string; /** * Size of the input control. */ "size": "small" | "medium" | "large"; } } declare global { interface HTMLFwButtonElement extends Components.FwButton, HTMLStencilElement { } var HTMLFwButtonElement: { prototype: HTMLFwButtonElement; new (): HTMLFwButtonElement; }; interface HTMLFwCheckboxElement extends Components.FwCheckbox, HTMLStencilElement { } var HTMLFwCheckboxElement: { prototype: HTMLFwCheckboxElement; new (): HTMLFwCheckboxElement; }; interface HTMLFwDatepickerElement extends Components.FwDatepicker, HTMLStencilElement { } var HTMLFwDatepickerElement: { prototype: HTMLFwDatepickerElement; new (): HTMLFwDatepickerElement; }; interface HTMLFwDropdownButtonElement extends Components.FwDropdownButton, HTMLStencilElement { } var HTMLFwDropdownButtonElement: { prototype: HTMLFwDropdownButtonElement; new (): HTMLFwDropdownButtonElement; }; interface HTMLFwIconElement extends Components.FwIcon, HTMLStencilElement { } var HTMLFwIconElement: { prototype: HTMLFwIconElement; new (): HTMLFwIconElement; }; interface HTMLFwInputElement extends Components.FwInput, HTMLStencilElement { } var HTMLFwInputElement: { prototype: HTMLFwInputElement; new (): HTMLFwInputElement; }; interface HTMLFwLabelElement extends Components.FwLabel, HTMLStencilElement { } var HTMLFwLabelElement: { prototype: HTMLFwLabelElement; new (): HTMLFwLabelElement; }; interface HTMLFwModalElement extends Components.FwModal, HTMLStencilElement { } var HTMLFwModalElement: { prototype: HTMLFwModalElement; new (): HTMLFwModalElement; }; interface HTMLFwRadioElement extends Components.FwRadio, HTMLStencilElement { } var HTMLFwRadioElement: { prototype: HTMLFwRadioElement; new (): HTMLFwRadioElement; }; interface HTMLFwRadioGroupElement extends Components.FwRadioGroup, HTMLStencilElement { } var HTMLFwRadioGroupElement: { prototype: HTMLFwRadioGroupElement; new (): HTMLFwRadioGroupElement; }; interface HTMLFwSelectElement extends Components.FwSelect, HTMLStencilElement { } var HTMLFwSelectElement: { prototype: HTMLFwSelectElement; new (): HTMLFwSelectElement; }; interface HTMLFwSelectOptionElement extends Components.FwSelectOption, HTMLStencilElement { } var HTMLFwSelectOptionElement: { prototype: HTMLFwSelectOptionElement; new (): HTMLFwSelectOptionElement; }; interface HTMLFwSpinnerElement extends Components.FwSpinner, HTMLStencilElement { } var HTMLFwSpinnerElement: { prototype: HTMLFwSpinnerElement; new (): HTMLFwSpinnerElement; }; interface HTMLFwTabElement extends Components.FwTab, HTMLStencilElement { } var HTMLFwTabElement: { prototype: HTMLFwTabElement; new (): HTMLFwTabElement; }; interface HTMLFwTabsElement extends Components.FwTabs, HTMLStencilElement { } var HTMLFwTabsElement: { prototype: HTMLFwTabsElement; new (): HTMLFwTabsElement; }; interface HTMLFwTagElement extends Components.FwTag, HTMLStencilElement { } var HTMLFwTagElement: { prototype: HTMLFwTagElement; new (): HTMLFwTagElement; }; interface HTMLFwTextareaElement extends Components.FwTextarea, HTMLStencilElement { } var HTMLFwTextareaElement: { prototype: HTMLFwTextareaElement; new (): HTMLFwTextareaElement; }; interface HTMLFwTimepickerElement extends Components.FwTimepicker, HTMLStencilElement { } var HTMLFwTimepickerElement: { prototype: HTMLFwTimepickerElement; new (): HTMLFwTimepickerElement; }; interface HTMLFwToastElement extends Components.FwToast, HTMLStencilElement { } var HTMLFwToastElement: { prototype: HTMLFwToastElement; new (): HTMLFwToastElement; }; interface HTMLFwToggleElement extends Components.FwToggle, HTMLStencilElement { } var HTMLFwToggleElement: { prototype: HTMLFwToggleElement; new (): HTMLFwToggleElement; }; interface HTMLElementTagNameMap { "fw-button": HTMLFwButtonElement; "fw-checkbox": HTMLFwCheckboxElement; "fw-datepicker": HTMLFwDatepickerElement; "fw-dropdown-button": HTMLFwDropdownButtonElement; "fw-icon": HTMLFwIconElement; "fw-input": HTMLFwInputElement; "fw-label": HTMLFwLabelElement; "fw-modal": HTMLFwModalElement; "fw-radio": HTMLFwRadioElement; "fw-radio-group": HTMLFwRadioGroupElement; "fw-select": HTMLFwSelectElement; "fw-select-option": HTMLFwSelectOptionElement; "fw-spinner": HTMLFwSpinnerElement; "fw-tab": HTMLFwTabElement; "fw-tabs": HTMLFwTabsElement; "fw-tag": HTMLFwTagElement; "fw-textarea": HTMLFwTextareaElement; "fw-timepicker": HTMLFwTimepickerElement; "fw-toast": HTMLFwToastElement; "fw-toggle": HTMLFwToggleElement; } } declare namespace LocalJSX { interface FwButton { /** * Identifier of the theme based on which the button is styled. */ "color"?: "primary" | "secondary" | "danger" | "link" | "text"; /** * Disables the button on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled"?: boolean; /** * Sets the button to a full-width block. If the attribute’s value is undefined, the value is set to false. */ "expand"?: boolean; /** * Accepts the id of the fw-modal component to open it on click */ "modalTriggerId"?: string; /** * Triggered when the button loses focus. */ "onFwBlur"?: (event: CustomEvent) => void; /** * Triggered when the button is clicked. */ "onFwClick"?: (event: CustomEvent) => void; /** * Triggered when the button comes into focus. */ "onFwFocus"?: (event: CustomEvent) => void; /** * Size of the button. */ "size"?: "normal" | "mini" | "small"; /** * Button type based on which actions are performed when the button is clicked. */ "type"?: "button" | "reset" | "submit"; } interface FwCheckbox { /** * Sets the state of the check box to selected. If the attribute’s value is undefined, the value is set to false. */ "checked"?: boolean; /** * Disables the check box on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled"?: boolean; /** * Label displayed on the interface, for the check box. */ "label"?: string; /** * Name of the component, saved as part of form data. */ "name"?: string; /** * Triggered when the check box loses focus. */ "onFwBlur"?: (event: CustomEvent) => void; /** * Triggered when the check box’s value is modified. */ "onFwChange"?: (event: CustomEvent) => void; /** * Triggered when the check box comes into focus. */ "onFwFocus"?: (event: CustomEvent) => void; /** * Identifier corresponding to the component, that is saved when the form data is saved. */ "value"?: string; } interface FwDatepicker { /** * Format in which the date values selected in the calendar are populated in the input box and saved when the form data is saved. */ "dateFormat"?: string; /** * Starting date of the date range that is preselected in the calendar, if mode is range. Must be a date later than the min-date value. */ "fromDate"?: string; /** * Latest date a user can select in the calendar, if mode is range. */ "maxDate"?: string; /** * Earliest date a user can select in the calendar, if mode is range. */ "minDate"?: string; /** * Type of date selection enabled for the calendar. If the value is range, a user can select a date range in the calendar. */ "mode"?: "single date" | "range"; /** * Name of the component, saved as part of form data. */ "name"?: string; /** * Triggered when the update button clicked */ "onFwChange"?: (event: CustomEvent) => void; /** * Text displayed in the input box before a user selects a date or date range. */ "placeholder"?: string; /** * Ending date of the date range that is preselected in the calendar, if mode is range. Must be a date earlier than the max-date value. */ "toDate"?: string; /** * Date that is preselected in the calendar, if mode is single date or undefined. */ "value"?: string; } interface FwDropdownButton { /** * Dropdown Button color */ "color"?: "primary" | "secondary" | "danger" | "link" | "text"; /** * Disables the dropdown button if its true */ "disabled"?: boolean; /** * Label for the dropdown button */ "label"?: string; /** * Triggered when an option is clicked */ "onFwOptionClick"?: (event: CustomEvent) => void; /** * Triggered when Add button for searchable dropdown is clicked */ "onFwOptionsAdd"?: (event: CustomEvent) => void; /** * Options to show in the dropdown button */ "options"?: any[]; /** * Placeholder text for search input. Validated only if dropdown and searchable is true */ "placeholder"?: string; /** * Displays a searchable dropdown button */ "searchable"?: boolean; /** * Displays a split dropdown button */ "split"?: boolean; /** * Value of the dropdown button */ "value"?: any; } interface FwIcon { /** * Color in which the icon is displayed, specified as a standard CSS color or as a HEX code. */ "color"?: string; /** * Identifier of the icon. The attribute’s value must be a valid svg file in the repo of icons (assets/icons). */ "name"?: string; /** * Size of the icon, specified in number of pixels. */ "size"?: number; } interface FwInput { /** * Specifies whether the browser can display suggestions to autocomplete the text value. */ "autocomplete"?: "on" | "off"; /** * Specifies whether the browser can auto focus the input field */ "autofocus"?: boolean; /** * Displays a right-justified clear icon in the text box. Clicking the icon clears the input text. If the attribute’s value is undefined, the value is set to false. For a read-only input box, the clear icon is not displayed unless a default value is specified for the input box. */ "clearInput"?: boolean; /** * Disables the component on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled"?: boolean; /** * Identifier of the icon that is displayed in the left side of the text box. The attribute’s value must be a valid svg file in the repo of icons (assets/icons). */ "iconLeft"?: string; /** * Identifier of the icon that is displayed in the right side of the text box. The attribute’s value must be a valid svg file in the repo of icons (assets/icons). */ "iconRight"?: string; /** * Label displayed on the interface, for the component. */ "label"?: string; /** * Maximum number of characters a user can enter in the text box. */ "maxlength"?: number; /** * Minimum number of characters a user must enter in the text box for the value to be valid. */ "minlength"?: number; /** * Name of the component, saved as part of form data. */ "name"?: string; /** * Triggered when the input box loses focus. */ "onFwBlur"?: (event: CustomEvent) => void; /** * Triggered when the value in the input box is modified. */ "onFwChange"?: (event: CustomEvent) => void; /** * Triggered when the input box comes into focus. */ "onFwFocus"?: (event: CustomEvent) => void; /** * Triggered when a value is entered in the input box. */ "onFwInput"?: (event: CustomEvent) => void; /** * Triggered when clear icon is clicked. */ "onFwInputClear"?: (event: CustomEvent) => void; /** * Text displayed in the text box before a user enters a value. */ "placeholder"?: string | null; /** * If true, the user cannot enter a value in the input box. If the attribute’s value is undefined, the value is set to false. */ "readonly"?: boolean; /** * Specifies the input box as a mandatory field and displays an asterisk next to the label. If the attribute’s value is undefined, the value is set to false. */ "required"?: boolean; /** * Theme based on which the text box is styled. */ "state"?: "normal" | "warning" | "error"; /** * Descriptive or instructional text displayed below the text box. */ "stateText"?: string; /** * Type of value accepted as the input value. If a user enters a value other than the specified type, the input box is not populated. */ "type"?: "text" | "number"; /** * Default value displayed in the input box. */ "value"?: string | null; } interface FwLabel { /** * Theme based on which the label is styled. */ "color"?: "blue" | "red" | "green" | "yellow" | "grey" | "normal"; /** * Display text in the label. */ "value"?: string; } interface FwModal { /** * The text for the cancel button */ "cancelText"?: string; /** * Enable custom footer */ "customFooter"?: boolean; /** * The title text to be displayed on the modal */ "description"?: string; /** * Hides the footer */ "hideFooter"?: boolean; /** * The icon to be displayed with the title */ "icon"?: string; /** * Triggered when the default action button is clicked. */ "onFwAction"?: (event: CustomEvent) => void; /** * Triggered when modal is closed. */ "onFwClosed"?: (event: CustomEvent) => void; /** * Size of the modal */ "size"?: "standard" | "small" | "large"; /** * The text for the success button */ "successText"?: string; /** * The title text to be displayed on the modal */ "titleText"?: string; /** * Toggle the visibility of the modal */ "visible"?: boolean; } interface FwRadio { /** * Sets the state to selected. If the attribute’s value is undefined, the value is set to false. */ "checked"?: boolean; /** * Disables the component on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled"?: boolean; /** * Label displayed on the interface, for the component. */ "label"?: string; /** * Name of the component, saved as part of form data. */ "name"?: string; /** * Triggered when the radio button loses focus. */ "onFwBlur"?: (event: CustomEvent) => void; /** * Triggered when the radio button in focus is cleared. */ "onFwDeselect"?: (event: CustomEvent) => void; /** * Triggered when the radio button comes into focus. */ "onFwFocus"?: (event: CustomEvent) => void; /** * Triggered when the radio button in focus is selected. */ "onFwSelect"?: (event: CustomEvent) => void; /** * Identifier corresponding to the component, that is saved when the form data is saved. */ "value"?: string; } interface FwRadioGroup { /** * If true, a radio group can be saved without selecting any option. If an option is selected, the selection can be cleared. If the attribute’s value is undefined, the value is set to false. */ "allowEmpty"?: boolean; /** * Name of the component, saved as part of form data. */ "name"?: string; /** * Triggered when an option in the Radio Group is selected or deselected. */ "onFwChange"?: (event: CustomEvent) => void; /** * Default option that is selected when the radio group is displayed on the interface. Must be a valid value corresponding to the fw-radio components used in the Radio Group. */ "value"?: any | null; } interface FwSelect { /** * If true, the select component is auto focused on the page */ "autofocus"?: boolean; /** * Disables the component on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled"?: boolean; /** * If true, the user must select a value. The default value is not displayed. */ "forceSelect"?: boolean; /** * Label displayed on the interface, for the component. */ "label"?: string; /** * Works with `multiple` enabled. Configures the maximum number of options that can be selected with a multi-select component. */ "max"?: number; /** * Enables selection of multiple options. If the attribute’s value is undefined, the value is set to false. */ "multiple"?: boolean; /** * Name of the component, saved as part of form data. */ "name"?: string; /** * Triggered when the list box loses focus. */ "onFwBlur"?: (event: CustomEvent) => void; /** * Triggered when a value is selected or deselected from the list box options. */ "onFwChange"?: (event: CustomEvent) => void; /** * Triggered when the list box comes into focus. */ "onFwFocus"?: (event: CustomEvent) => void; /** * Text displayed in the list box before an option is selected. */ "placeholder"?: string | null; /** * If true, the user cannot modify the default value selected. If the attribute's value is undefined, the value is set to true. */ "readonly"?: boolean; /** * Specifies the select field as a mandatory field and displays an asterisk next to the label. If the attribute’s value is undefined, the value is set to false. */ "required"?: boolean; /** * Theme based on which the list box is styled. */ "state"?: "normal" | "warning" | "error"; /** * Descriptive or instructional text displayed below the list box. */ "stateText"?: string; /** * Type of option accepted as the input value. If a user tries to enter an option other than the specified type, the list is not populated. */ "type"?: "text" | "number"; /** * Value of the option that is displayed as the default selection, in the list box. Must be a valid value corresponding to the fw-select-option components used in Select. */ "value"?: any; } interface FwSelectOption { /** * Sets the state of the option to disabled. The selected option is disabled and greyed out. If the attribute’s value is undefined, the value is set to false. */ "disabled"?: boolean; /** * States that the option is an HTML value. If the attribute's value is undefined, the value is set to true. */ "html"?: boolean; /** * HTML content that is displayed as the option. */ "htmlContent"?: string; /** * Triggered when an option is selected. */ "onFwSelected"?: (event: CustomEvent) => void; /** * Alternate text displayed on the interface, in place of the actual HTML content. */ "optionText"?: string; /** * Sets the state of the option to selected. The selected option is highlighted and a check mark is displayed next to it. If the attribute’s value is undefined, the value is set to false. */ "selected"?: boolean; /** * Value corresponding to the option, that is saved when the form data is saved. */ "value"?: string; } interface FwSpinner { /** * Color in which the loader is displayed, specified as a standard CSS color. */ "color"?: string; /** * Size of the loader. */ "size"?: "small" | "medium" | "large" | "default"; } interface FwTab { /** * Disables this tab */ "disabled"?: boolean; /** * Triggered when either tabHeader or tabHeaderHtml changes. */ "onPropChanged"?: (event: CustomEvent) => void; /** * Name of the tab displayed on the UI. */ "tabHeader"?: string; /** * HTML that can be rendered in tab header. */ "tabHeaderHtml"?: string; } interface FwTabs { /** * The index of the activated Tab(Starts from 0) */ "activeTabIndex"?: number; /** * Triggered when a the view switches to a new tab. */ "onFwChange"?: (event: CustomEvent) => void; } interface FwTag { /** * Sets the state of the tag to disabled. The close button is disabled. If the attribute’s value is undefined, the value is set to false. */ "disabled"?: false; /** * Triggered when the tag is deselected. */ "onFwClosed"?: (event: CustomEvent) => void; /** * Display text in the tag component. */ "text"?: string; /** * Value associated with the tag component, that is saved when the form data is saved. */ "value"?: string; } interface FwTextarea { /** * If true, the textarea is autofocused */ "autofocus"?: boolean; /** * Width of the input box, specified as number of columns. */ "cols"?: number; /** * Disables the text area on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled"?: boolean; /** * Label displayed on the interface, for the component. */ "label"?: string; /** * Maximum number of characters a user can enter in the input box. */ "maxlength"?: number; /** * Minimum number of characters a user must enter in the input box for the value to be valid. */ "minlength"?: number; /** * Name of the component, saved as part of form data. */ "name"?: string; /** * Triggered when the input box loses focus. */ "onFwBlur"?: (event: CustomEvent) => void; /** * Triggered when the value in the input box is modified. */ "onFwChange"?: (event: CustomEvent) => void; /** * Triggered when the input box comes into focus. */ "onFwFocus"?: (event: CustomEvent) => void; /** * Triggered when a value is entered in the input box. */ "onFwInput"?: (event: CustomEvent) => void; /** * Text displayed in the input box before a user enters a value. */ "placeholder"?: string | null; /** * If true, the user cannot enter a value in the input box. If the attribute’s value is undefined, the value is set to false. */ "readonly"?: boolean; /** * Specifies the input box as a mandatory field and displays an asterisk next to the label. If the attribute’s value is undefined, the value is set to false. */ "required"?: boolean; /** * Height of the input box, specified as number of rows. */ "rows"?: number; /** * Theme based on which the input box is styled. */ "state"?: "normal" | "warning" | "error"; /** * Descriptive or instructional text displayed below the input box. */ "stateText"?: string; /** * Default value displayed in the input box. */ "value"?: string | null; /** * Type of text wrapping used by the input box. If the value is hard, the text in the textarea is wrapped (contains line breaks) when the form data is saved. If the value is soft, the text in the textarea is saved as a single line, when the form data is saved. */ "wrap"?: "soft" | "hard"; } interface FwTimepicker { /** * Set true to disable the element */ "disabled"?: boolean; /** * Format in which time values are populated in the list box. If the value is hh:mm p, the time values are in the 12-hour format. If the value is hh:mm, the time values are in the 24-hr format. */ "format"?: "hh:mm A" | "HH:mm"; /** * Time interval between the values displayed in the list, specified in minutes. */ "interval"?: number; /** * Upper time-limit for the values displayed in the list. If this attribute’s value is in the hh:mm format, it is assumed to be hh:mm AM. */ "maxTime"?: string; /** * Lower time-limit for the values displayed in the list. If this attribute’s value is in the hh:mm format, it is assumed to be hh:mm AM. */ "minTime"?: string; /** * Name of the component, saved as part of form data. */ "name"?: string; /** * Time output value */ "value"?: string; } interface FwToast { /** * The Content of the action link */ "actionLinkText"?: string; /** * The content to be diaplyed in toast */ "content"?: string; /** * Triggered when the action link clicked. */ "onFwLinkClick"?: (event: CustomEvent) => void; /** * Pause the toast from hiding on mouse hover */ "pauseOnHover"?: boolean; /** * position of the toast notification in screen */ "position"?: "top-center" | "top-left" | "top-right"; /** * won't close automatically */ "sticky"?: boolean; /** * Time duration of the toast visibility */ "timeout"?: number; /** * Type of the toast - success,failure, warning, inprogress */ "type"?: "success" | "error" | "warning" | "inprogress"; } interface FwToggle { /** * Sets the selected state as the default state. If the attribute’s value is undefined, the value is set to false. */ "checked"?: boolean; /** * Specifies whether to disable the control on the interface. If the attribute’s value is undefined, the value is set to false. */ "disabled"?: boolean; /** * Name of the component, saved as part of the form data. */ "name"?: string; /** * Triggered when the input control is selected or deselected. */ "onFwChange"?: (event: CustomEvent) => void; /** * Size of the input control. */ "size"?: "small" | "medium" | "large"; } interface IntrinsicElements { "fw-button": FwButton; "fw-checkbox": FwCheckbox; "fw-datepicker": FwDatepicker; "fw-dropdown-button": FwDropdownButton; "fw-icon": FwIcon; "fw-input": FwInput; "fw-label": FwLabel; "fw-modal": FwModal; "fw-radio": FwRadio; "fw-radio-group": FwRadioGroup; "fw-select": FwSelect; "fw-select-option": FwSelectOption; "fw-spinner": FwSpinner; "fw-tab": FwTab; "fw-tabs": FwTabs; "fw-tag": FwTag; "fw-textarea": FwTextarea; "fw-timepicker": FwTimepicker; "fw-toast": FwToast; "fw-toggle": FwToggle; } } export { LocalJSX as JSX }; declare module "@stencil/core" { export namespace JSX { interface IntrinsicElements { "fw-button": LocalJSX.FwButton & JSXBase.HTMLAttributes; "fw-checkbox": LocalJSX.FwCheckbox & JSXBase.HTMLAttributes; "fw-datepicker": LocalJSX.FwDatepicker & JSXBase.HTMLAttributes; "fw-dropdown-button": LocalJSX.FwDropdownButton & JSXBase.HTMLAttributes; "fw-icon": LocalJSX.FwIcon & JSXBase.HTMLAttributes; "fw-input": LocalJSX.FwInput & JSXBase.HTMLAttributes; "fw-label": LocalJSX.FwLabel & JSXBase.HTMLAttributes; "fw-modal": LocalJSX.FwModal & JSXBase.HTMLAttributes; "fw-radio": LocalJSX.FwRadio & JSXBase.HTMLAttributes; "fw-radio-group": LocalJSX.FwRadioGroup & JSXBase.HTMLAttributes; "fw-select": LocalJSX.FwSelect & JSXBase.HTMLAttributes; "fw-select-option": LocalJSX.FwSelectOption & JSXBase.HTMLAttributes; "fw-spinner": LocalJSX.FwSpinner & JSXBase.HTMLAttributes; "fw-tab": LocalJSX.FwTab & JSXBase.HTMLAttributes; "fw-tabs": LocalJSX.FwTabs & JSXBase.HTMLAttributes; "fw-tag": LocalJSX.FwTag & JSXBase.HTMLAttributes; "fw-textarea": LocalJSX.FwTextarea & JSXBase.HTMLAttributes; "fw-timepicker": LocalJSX.FwTimepicker & JSXBase.HTMLAttributes; "fw-toast": LocalJSX.FwToast & JSXBase.HTMLAttributes; "fw-toggle": LocalJSX.FwToggle & JSXBase.HTMLAttributes; } } }