vira
Version:
A simple and highly versatile design system using element-vir.
45 lines (44 loc) • 1.71 kB
TypeScript
import { type PartialWithUndefined } from '@augment-vir/common';
import { type AttributeValues, type CSSResult } from 'element-vir';
import { ViraIcon } from './vira-icon.element.js';
/**
* All inner elements supported by {@link ViraCheckbox}.
*
* @category Internals
*/
export type ViraCheckboxInnerElements = 'label' | 'custom-checkbox' | 'text' | typeof ViraIcon.tagName;
/**
* Inputs for {@link ViraCheckbox}.
*
* @category Internal
*/
export type ViraCheckboxInputs = {
value: boolean;
} & PartialWithUndefined<{
stylePassthrough: Partial<Record<ViraCheckboxInnerElements, CSSResult>>;
attributePassthrough: Partial<Record<ViraCheckboxInnerElements, AttributeValues>>;
isDisabled: boolean;
/**
* Text label for the checkbox. Used as the fallback when the `vira-checkbox-label` slot is not
* filled.
*/
label: string;
hasError: boolean;
useHorizontalLabel: boolean;
/** The checkbox will be filled with a form selection color when it is checked. */
fillWhenChecked: boolean;
/** The checkbox will be filled with a form error color when it is unchecked. */
fillWhenUnchecked: boolean;
}>;
/**
* A custom checkbox.
*
* @category Input
* @category Elements
* @see https://electrovir.github.io/vira/book/elements/vira-checkbox
*/
export declare const ViraCheckbox: import("element-vir").DeclarativeElementDefinition<`vira-${string}`, Readonly<ViraCheckboxInputs>, {
hasSlottedLabel: boolean;
}, {
valueChange: import("element-vir").DefineEvent<boolean>;
}, "vira-checkbox-horizontal" | "vira-checkbox-filled-checked" | "vira-checkbox-filled-unchecked", `vira-${string}-`, readonly ["vira-checkbox-label"], readonly []>;