finpro/dist/components/fp-checkbox-group/fp-checkbox-group.d.ts

Design System

import { CSSResultGroup, TemplateResult } from 'lit';
import 'element-internals-polyfill';
import FpCheckbox from './fp-checkbox/fp-checkbox';
import FinproElement from '../../internals/finpro-element';
export declare const fpCheckboxGroupTag = "fp-checkbox-group";
export declare const fpChangeEventName = "fp-checkbox-group-change";
declare const FpCheckboxGroup_base: import("@open-wc/form-control").Constructor<import("@open-wc/form-control").FormControlInterface> & typeof FinproElement;
/**
 * @tag fp-checkbox-group
 * @summary Finpro Button component
 *
 * @cssproperty --fp-checkbox-direction - Can be used for showing checkbox options as columns instead of rows. Options are `row` or `column`
 */
export default class FpCheckboxGroup extends FpCheckboxGroup_base {
    static get styles(): CSSResultGroup;
    /**
     * Sets the checkbox group label
     */
    label: string;
    /**
     * Set and gets the actual value of the field
     */
    value: string[];
    /**
     * Sets option as required
     */
    required: boolean;
    get options(): FpCheckbox[];
    get checkedOptions(): string[];
    get availableOptions(): FpCheckbox[];
    connectedCallback(): void;
    disconnectedCallback(): void;
    updated(changedProperties: Map<string, unknown>): void;
    /**
     * Fires when checkbox group value changed
     */
    private onChange;
    private focusedOptionIndex;
    private handleOptionChecked;
    private handleKeyDown;
    private handleFocus;
    render(): TemplateResult;
}
declare global {
    interface HTMLElementTagNameMap {
        [fpCheckboxGroupTag]: FpCheckboxGroup;
    }
    interface HTMLElementEventMap {
        [fpChangeEventName]: CustomEvent<string[]>;
    }
}
export {};
//# sourceMappingURL=fp-checkbox-group.d.ts.map