import { EventEmitter } from '../../stencil-public-runtime'; import { type LabelPlacement } from '../../utils/constants'; /** * @slot default - Next to the label and description. * @slot main - Replaces the label and description. * @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. * @slot checked-icon - Content to be placed as the checked icon, will override the checkedIcon prop. * @slot indeterminate-icon - Content to be placed as the indeterminate icon, will override the indeterminateIcon prop. */ export declare class NvFieldcheckbox { el: HTMLNvFieldcheckboxElement; /****************************************************************************/ /** * Message define a 'hint ' message for the Field. * @deprecated Use `description` instead. * */ readonly message?: string; /** * The text for the validation message. * @deprecated Use `errorDescription` and set the error prop instead. * */ readonly validation?: string; /** * When true, the label will be placed before the checkbox. * @deprecated Use `labelPlacement = end` instead. * */ readonly labelBefore?: boolean; /****************************************************************************/ /** * Sets the ID for the radio button’s input 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; /** * The name attribute for the checkbox input, used to reference the form data * after submission. */ readonly name?: string; /** * The value attribute of the checkbox input, representing the value sent on * form submission when the checkbox is checked. When the form is submitted, * the data will consist of a name=value pair. */ readonly value?: string; /** * The label displayed next to the checkbox. */ readonly label?: string; /** * Determines the position of the label relative to the checkbox, either * 'start' (before) or 'end' (after). */ labelPlacement: `${LabelPlacement}`; /** * Hides the label visually while still keeping it available for screen * readers. */ readonly hideLabel: boolean; /** * A description providing additional context or information about the * checkbox. */ description?: string; /** * Signals that there is an error associated with the checkbox, which can * trigger visual cues. * @validator error */ error: boolean; /** * A description that appears when there is an error related to the checkbox. * @validator message */ errorDescription?: string; /** * Indicates whether the checkbox is checked or not. */ checked: boolean; /** * Indicates whether the checkbox is in an indeterminate state, typically used * for hierarchical checkboxes. */ indeterminate: boolean; /** * Disables the checkbox, preventing user interaction. */ readonly disabled: boolean; /** * Sets the checkbox to read-only, preventing user changes but still allowing * focus and selection of text. */ readonly readonly: boolean; /** * Marks the checkbox as required, indicating that it must be checked for * form submission. * @note This uses the native HTML `required` attribute, which triggers browser validation. */ readonly required: boolean; /** * Marks the checkbox 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; /** * Applies focus to the input field as soon as the component is mounted. This * is equivalent to setting the native autofocus attribute on an * element. */ readonly autofocus: boolean; /****************************************************************************/ /** * Emits when the checked state changes. * @bind checked */ checkedChanged: EventEmitter; /****************************************************************************/ /** * Listens for the change event on the checkbox input element and updates the * checked state. * @param {Event} event - The change event. */ handleChange(event: Event): void; /****************************************************************************/ /** * Watches for changes to the checked state and emits the new value. * @param {boolean} checked - The new value of the checked state. */ onCheckedChanged(checked: boolean): void; /****************************************************************************/ componentWillRender(): void; /****************************************************************************/ render(): any; }