import { EventEmitter } from '../../stencil-public-runtime';
/**
 * @slot default - Content to be placed inside the select element.
 * @slot leading-input - Content to be placed before the select input, within the select container.
 * @slot before-input - Content to be placed before the select input, outside the select container.
 * @slot after-input - Content to be placed after the select input, outside the select container.
 * @slot label - Content to be placed as the label, will override the label prop.
 * @slot description - Content to be placed as the description, will override the description prop.
 * @slot error-description - Content to be placed as the error description, will override the errorDescription prop.
 */
export declare class NvFieldselect {
    el: HTMLNvFieldselectElement;
    private selectElement;
    private internals;
    /****************************************************************************/
    /**
     * Message defines a 'hint ' message for the Select Field.
     * @deprecated Use `description` instead.
     */
    readonly message: string;
    /**
     * Add the message to the validation state.
     * @deprecated Use `errorDescription` and set the error prop instead.
     */
    readonly validation: string;
    /****************************************************************************/
    private computedDisplayValue;
    private internalReadonly;
    /**
     * Options to display in the select.
     * Format: [{ label: string, value: string, selected?: boolean, disabled?: boolean }]
     */
    readonly options?: Array<{
        /**
         * The label of the option
         */
        label: string;
        /**
         * The value of the option
         */
        value: string;
        /**
         * Whether the option is selected
         */
        selected?: boolean;
        /**
         * Whether the option is disabled
         */
        disabled?: boolean;
    }>;
    /****************************************************************************/
    /**
     * Sets the ID for the select element and the for attribute of the associated
     * label. If no ID is provided, a random one will be automatically generated
     * to ensure unique identification, facilitating proper label association and
     * accessibility.
     */
    readonly inputId: string;
    /**
     * Lets you define the text that explains what users should choose in the
     * select field. It’s a crucial element for making forms clear and
     * user-friendly.
     */
    readonly label?: string;
    /**
     * Add helpful hints or extra information under the select field. This is
     * where you can clarify what users should choose or provide additional
     * instructions, making the form easier to fill out correctly.
     */
    description?: string;
    /**
     * Defines the name attribute of the select field, which is crucial for form
     * submission. This value is used as the key in the key-value pair sent to
     * the server, representing the selected data in form submissions. It should be
     * unique within the form to avoid conflicts
     */
    readonly name: string;
    /**
     * The disabled prop lets you turn off the select field so that users can’t
     * choose something. When disabled, the field is grayed out and won’t respond to
     * clicks or touches.
     */
    readonly disabled: boolean;
    /**
     * Display the select field’s content without allowing users to change it.
     * Users can still click on it, select, and copy the text, but they won’t be
     * able to change or delete anything.
     */
    readonly readonly: boolean;
    /**
     * Marks the select field as required, ensuring that the user must fill it out
     * before submitting the form.
     * @note This uses the native HTML `required` attribute, which triggers browser validation.
     */
    readonly required: boolean;
    /**
     * Marks the select field as required for accessibility purposes without triggering
     * native HTML validation. Use this when implementing custom validation logic.
     * @note When set, this uses `aria-required` instead of the native `required` attribute.
     * This allows developers to implement custom validation while maintaining accessibility.
     * @note If this prop is not explicitly set, the component will check for the HTML attribute
     * 'aria-required' directly to determine if it should be applied.
     */
    readonly ariaRequiredAttr: boolean;
    /**
     * Alters the select field's appearance to indicate an error, helping users
     * identify fields that need correction.
     * @validator error
     */
    error: boolean;
    /**
     * Show a helpful message under the select field when there’s a problem. It
     * explains what’s wrong and how users can fix it, making the error easier to
     * understand and resolve.
     * @validator message
     */
    errorDescription: string;
    /**
     * Changes the select field’s appearance to indicate successful input or
     * validation.
     */
    readonly success: boolean;
    /**
     * When enabled, allows the select to handle multiple selections.
     */
    readonly multiple: boolean;
    /**
     * Shows the inline clear (×) button when a value is selected. The
     * programmatic `clear()` method works regardless of this prop — leave
     * it off when you want to manage clearing from outside the component.
     */
    readonly clearable: boolean;
    /**
     * The value of the select field.
     * - If `multiple` is `false`, it's a single string.
     * - If `multiple` is `true`, it's a comma-separated string of selected values.
     */
    value: string;
    /**
     * When enabled, displays the value element instead of the label when readonly.
     * By default, the label is displayed in readonly mode. Also it automatically
     * sets the component to readonly.
     */
    readonly displayValue: boolean;
    /**
     * Applies focus to the input field as soon as the component is mounted. This
     * is equivalent to setting the native autofocus attribute on a <select>
     * element.
     */
    readonly autofocus: boolean;
    /**
     * Allows the field to stretch and fill the entire width of its container.
     */
    readonly fluid: boolean;
    /****************************************************************************/
    /**
     * Emitted when the selected value changes.
     * @bind value
     */
    valueChanged: EventEmitter<string>;
    /**
     * Emitted when the field is cleared via the inline clear button or the
     * programmatic `clear()` method. Useful for reacting to user-initiated
     * clears without subscribing to every `valueChanged` emission.
     */
    cleared: EventEmitter<void>;
    /****************************************************************************/
    /**
     * Updates the display value when the value property changes. This watcher is
     * used to update the display value when the selected value changes. This is
     * necessary for readonly select fields to display the selected value.
     * @internal This watcher is not intended to be called outside of the component.
     * @param {string} newValue - The new value of the select field.
     */
    updateDisplayValueWatcher(newValue: string): void;
    /**
     * Watcher for the displayValue prop to ensure internalReadonly is true when displayValue is true.
     * @param {boolean} newValue - The new value of displayValue.
     */
    handleDisplayValueChange(newValue: boolean): void;
    /**
     * Watcher for the readonly prop to ensure internalReadonly is true when readonly is true.
     * @param {boolean} newValue - The new value of readonly.
     */
    handleReadonlyChange(newValue: boolean): void;
    /**
     * Handle options change and update the internal state
     * @param {typeof this.options} newValue - The new value of options
     */
    handleOptionsChange(newValue: typeof this.options): void;
    /****************************************************************************/
    /**
     * Handles the change event on the select element. This method is used to
     * update the value property when the selected options change. It is also
     * used to emit the selectChanged event when the selected value changes.
     * @param {Event} event - The change event on the select element.
     * @emits selectChanged
     */
    private readonly handleSelectChange;
    /**
     * Handles focus when the select container is clicked.
     */
    private readonly handleSelectContainerClick;
    /**
     * Handles a click on the inline clear button. Stops the click from
     * bubbling up to the select container (which would refocus the select)
     * and clears the value. On keyboard activation (Enter/Space) it also
     * moves focus back to the native `<select>` so keyboard users don't
     * lose their place when the button disappears.
     * @param {MouseEvent} event - The click event from the clear button.
     */
    private readonly handleClearButtonClick;
    /**
     * Updates the display value of the select field. This method is used to
     * update the display value when the selected value changes. This is necessary
     * for readonly select fields to display the selected value. This method is
     * called in the componentDidLoad lifecycle hook and the updateDisplayValueWatcher
     * watcher.
     * @internal This method is not intended to be called outside of the component.
     */
    private updateDisplayValue;
    /**
     * Retrieves the label from the <option> elements based on the provided key (value).
     * This method uses the id or value attribute directly from the <select> options.
     * @param {string} key - The key (value) for which to find the corresponding label.
     * @returns {string} The label if found; otherwise, an empty string.
     */
    private getLabelFromId;
    /**
     * Sets the value of the form element for form submission. This method is
     * called when the selected value changes or when the value property is set.
     * @internal This method is not intended to be called outside of the component.
     */
    private setFormValue;
    /**
     * Ensures the select element is available. This method is used to ensure
     * the select element is available before attempting to access it.
     * @internal This method is not intended to be called outside of the component.
     */
    private ensureSelectElement;
    /**
     * Clears the current selection. Resets the value to an empty string and
     * emits `valueChanged` and `cleared` when the value actually changed.
     * The `@Watch('value')` watcher takes care of syncing the underlying
     * native `<select>` options and the form value.
     */
    clear(): Promise<void>;
    /****************************************************************************/
    componentWillRender(): void;
    /**
     * Lifecycle method that is called before the component is rendered. This is
     * where the internal state is set up before rendering occurs.
     */
    componentWillLoad(): void;
    /**
     * Lifecycle method that is called after the component has been rendered.
     * This is where the display value is updated and the initial select element's
     * state is set.
     */
    componentDidLoad(): void;
    /****************************************************************************/
    /**
     * The render method creates the HTML structure for the component, including
     * the label, select element, and any error or description messages. It also
     * applies the appropriate CSS classes based on the readonly state and
     * displayValue prop. This method is called when the component is rendered.
     * @returns {HTMLStencilElement} The HTML element to render.
     */
    render(): any;
}