gentics-ui-core/components/checkbox/checkbox.component.d.ts

This is the common core framework for the Gentics CMS and Mesh UI, and other Angular applications.

import { ChangeDetectorRef, ElementRef, EventEmitter } from '@angular/core';
import { ControlValueAccessor } from '@angular/forms';
import * as i0 from "@angular/core";
export declare type CheckState = boolean | 'indeterminate';
/**
 * Checkbox wraps the native `<input type="checkbox">` form element.
 *
 * ```html
 * <gtx-checkbox [(ngModel)]="isOkay" label="Is it okay?"></gtx-checkbox>
 * <gtx-checkbox [(ngModel)]="checkStates.B" value="B" label="B"></gtx-checkbox>
 * ```
 *
 * ## Stateless Mode
 * By default, the Checkbox keeps track of its own internal checked state. This makes sense
 * for most use cases, such as when used in a form bound to NgControl.
 *
 * However, in some cases we want to explicitly set the state from outside. This is done by binding
 * to the <code>checked</code> attribute. When this attribute is bound, the checked state of the
 * Checkbox will *only* change when the value of the binding changes. Clicking on the Checkbox
 * will have no effect other than to emit an event which the parent can use to update the binding.
 *
 * Here is a basic example of a stateless checkbox where the parent component manages the state:
 *
 * ```html
 * <gtx-checkbox [checked]="isChecked"
 *               (change)="isChecked = $event"></gtx-checkbox>
 * ```
 */
export declare class Checkbox implements ControlValueAccessor {
    private changeDetector;
    /**
     * Sets the checkbox to be auto-focused. Handled by `AutofocusDirective`.
     */
    autofocus: boolean;
    /**
     * Checked state of the checkbox. When set, the Checkbox will be
     * in stateless mode.
     */
    get checked(): boolean;
    set checked(value: boolean);
    /**
     * Set to "indeterminate" for an indeterminate state (-)
     */
    get indeterminate(): boolean;
    set indeterminate(val: boolean);
    /**
     * Set the checkbox to its disabled state.
     */
    disabled: boolean;
    /**
     * Checkbox ID
     */
    id: string;
    /**
     * Label for the checkbox
     */
    label: string;
    /**
     * Form name for the checkbox
     */
    name: string;
    /**
     * Sets the required property
     */
    required: boolean;
    /**
     * The value of the checkbox
     */
    value: any;
    /**
     * Blur event
     */
    blur: EventEmitter<CheckState>;
    /**
     * Focus event
     */
    focus: EventEmitter<CheckState>;
    /**
     * Change event
     */
    change: EventEmitter<CheckState>;
    checkState: CheckState;
    tabbedFocus: boolean;
    labelElement: ElementRef;
    /**
     * See note above on stateless mode.
     */
    private statelessMode;
    constructor(changeDetector: ChangeDetectorRef);
    onBlur(): void;
    onFocus(): void;
    focusHandler(e: KeyboardEvent): void;
    writeValue(value: any): void;
    ngOnInit(): void;
    ngAfterViewInit(): void;
    onInputChanged(e: Event, input: HTMLInputElement): boolean;
    registerOnChange(fn: Function): void;
    registerOnTouched(fn: Function): void;
    setDisabledState(disabled: boolean): void;
    private onChange;
    private onTouched;
    /**
     * This is a hacky fix to prevent Materialize from animating ticked checkboxes which
     * kicks in when a checkbox is added to the dom with checked=false and immediately
     * set to checked=true.
     */
    private fixInitialAnimation;
    static ɵfac: i0.ɵɵFactoryDeclaration<Checkbox, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<Checkbox, "gtx-checkbox", never, { "autofocus": "autofocus"; "checked": "checked"; "indeterminate": "indeterminate"; "disabled": "disabled"; "id": "id"; "label": "label"; "name": "name"; "required": "required"; "value": "value"; }, { "blur": "blur"; "focus": "focus"; "change": "change"; }, never, never>;
}