@volverjs/ui-vue/dist/props/index.d.ts

@volverjs/ui-vue is a lightweight Vue 3 component library to accompany @volverjs/style.

import type { PropType } from 'vue';
import type { VvIconProps } from '@/components/VvIcon';
import type { AutoPlacementOptions, FlipOptions, OffsetOptions, ShiftOptions, SizeOptions } from '@/types/floating-ui';
import type { Option } from '@/types/generic';
import type { NavItem } from '@/types/nav';
import { ActionTag, ButtonType, Placement, Position, Side, StorageType, Strategy } from '@/constants';
export declare const LinkProps: {
    /**
     * The router-link/nuxt-link property, if it is defined the button is rendered as a ruouter-link or nuxt-link.
     * @see Documentation of [router-link](https://router.vuejs.org/api/#router-link) and [nuxt-link](https://nuxtjs.org/api/components-nuxt-link/)
     */
    to: {
        type: (ObjectConstructor | StringConstructor)[];
    };
    /**
     * Anchor href
     */
    href: StringConstructor;
    /**
     * Anchor target
     */
    target: StringConstructor;
    /**
     * Anchor rel
     */
    rel: {
        type: StringConstructor;
        default: string;
    };
};
export declare const ValidProps: {
    /**
     * Valid status
     */
    valid: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Valid label
     */
    validLabel: {
        type: (ArrayConstructor | StringConstructor)[];
        default: undefined;
    };
};
export declare const InvalidProps: {
    /**
     * Invalid status
     */
    invalid: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Invalid label
     */
    invalidLabel: {
        type: (ArrayConstructor | StringConstructor)[];
        default: undefined;
    };
};
export declare const LoadingProps: {
    /**
     * Loading status
     */
    loading: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Loading label
     */
    loadingLabel: {
        type: StringConstructor;
        default: string;
    };
};
export declare const DisabledProps: {
    /**
     * Whether the form control is disabled
     */
    disabled: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export declare const RequiredProps: {
    /**
     * Whether the form control is required
     */
    required: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export declare const SelectedProps: {
    /**
     * Whether the item is selected
     */
    selected: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export declare const ActiveProps: {
    /**
     * Whether the item is active
     */
    active: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export declare const CurrentProps: {
    /**
     * Whether the item is current
     */
    current: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export declare const ClearProps: {
    /**
     * If true, the clear button will be shown
     */
    showClearAction: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * VvIcon name for clear button
     * @see VvIcon
     */
    iconClear: {
        type: PropType<string | VvIconProps>;
        default: "close";
    };
    /**
     * Label for clear button
     */
    labelClear: {
        type: StringConstructor;
        default: string;
    };
};
export declare const PressedProps: {
    /**
     * Whether the item is pressed
     */
    pressed: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export declare const LabelProps: {
    /**
     * The item label
     */
    label: {
        type: (StringConstructor | NumberConstructor)[];
        default: undefined;
    };
};
export declare const ReadonlyProps: {
    /**
     * The value is not editable
     */
    readonly: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export declare const ModifiersProps: {
    /**
     * Component BEM modifiers
     */
    modifiers: {
        type: PropType<string | string[]>;
        default: undefined;
    };
};
export declare const HintProps: {
    hintLabel: {
        type: StringConstructor;
        default: string;
    };
};
export declare const OptionsProps: {
    /**
     * List of options, can be string[] or object[]
     */
    options: {
        type: PropType<(Option | string)[]>;
        default: () => never[];
    };
    /**
     * Used when options are objects: key to use for option label
     */
    labelKey: {
        type: (StringConstructor | FunctionConstructor)[];
        default: string;
    };
    /**
     * Used when options are objects: key to use for option label
     */
    valueKey: {
        type: (StringConstructor | FunctionConstructor)[];
        default: string;
    };
    /**
     * Used when options are objects: key to use for option disabled
     */
    disabledKey: {
        type: (StringConstructor | FunctionConstructor)[];
        default: string;
    };
};
export declare const CountProps: {
    /**
     * Show character limit
     */
    count: {
        type: (BooleanConstructor | StringConstructor)[];
        default: boolean;
        validator: (value: string) => boolean;
    };
};
export declare const DebounceProps: {
    /**
     * Milliseconds to wait before emitting the input event
     */
    debounce: {
        type: (StringConstructor | NumberConstructor)[];
        default: undefined;
    };
};
export declare const IconProps: {
    /**
     * VvIcon name or props
     * @see VvIcon
     */
    icon: {
        type: PropType<string | VvIconProps>;
        default: undefined;
    };
    /**
     * VvIcon position
     */
    iconPosition: {
        type: PropType<`${Position}`>;
        default: Position;
        validation: (value: Position) => boolean;
    };
};
export declare const TabindexProps: {
    /**
     * Global attribute tabindex
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex
     */
    tabindex: {
        type: (StringConstructor | NumberConstructor)[];
        default: number;
    };
};
export declare const FloatingLabelProps: {
    /**
     * If true the label will be floating
     */
    floating: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export declare const UnselectableProps: {
    /**
     * If true the input will be unselectable
     */
    unselectable: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export declare const IdProps: {
    /**
     * Global attribute id
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id
     */
    id: (StringConstructor | NumberConstructor)[];
};
export declare const DropdownProps: {
    /**
     * Dropdown placement
     */
    placement: {
        type: PropType<`${Side}` | `${Placement}`>;
        default: Side;
        validator: (value: Side & Placement) => boolean;
    };
    /**
     * Dropdown strategy
     */
    strategy: {
        type: PropType<`${Strategy}`>;
        default: undefined;
        validator: (value: Strategy) => boolean;
    };
    /**
     * Dropdown show / hide transition name
     */
    transitionName: {
        type: StringConstructor;
        default: undefined;
    };
    /**
     * Offset of the dropdown from the trigger
     * @see https://floating-ui.com/docs/offset
     */
    offset: {
        type: PropType<OffsetOptions | number | string>;
        default: number;
    };
    /**
     * Move dropdown to the side if there is no space in the default position
     * @see https://floating-ui.com/docs/shift
     */
    shift: {
        type: PropType<ShiftOptions | boolean>;
        default: boolean;
    };
    /**
     * Flip dropdown position if there is no space in the default position
     * @see https://floating-ui.com/docs/flip
     */
    flip: {
        type: PropType<FlipOptions | boolean>;
        default: boolean;
    };
    /**
     * Size of the dropdown
     * @see https://floating-ui.com/docs/size
     */
    size: {
        type: PropType<SizeOptions | boolean>;
        default: () => {
            padding: number;
        };
    };
    /**
     * Automatically change the position of the dropdown
     * @see https://floating-ui.com/docs/autoPlacement
     */
    autoPlacement: {
        type: PropType<AutoPlacementOptions | boolean>;
        default: boolean;
    };
    /**
     * Add arrow to the dropdown
     * @see https://floating-ui.com/docs/arrow
     */
    arrow: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Keep open dropdown on click outside
     */
    keepOpen: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Autofocus first item on dropdown open
     */
    autofocusFirst: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Set dropdown width to the same as the trigger
     */
    triggerWidth: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export declare const IdNameProps: {
    /**
     * Input / Textarea name
     * Name of the form control. Submitted with the form as part of a name/value pair
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name
     */
    name: {
        type: StringConstructor;
        required: boolean;
    };
    /**
     * Global attribute id
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id
     */
    id: (StringConstructor | NumberConstructor)[];
};
export declare const AutofocusProps: {
    /**
     * Global attribute autofocus
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus
     */
    autofocus: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export declare const AutocompleteProps: {
    /**
     * Global attribute autocomplete
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete
     */
    autocomplete: {
        type: StringConstructor;
        default: string;
    };
};
export declare const InputTextareaProps: {
    /**
     * Whether the form control is required
     */
    required: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Input / Textarea minlength
     * Minimum length (number of characters) of value
     * Available for input types: text, search, url, tel, email, password
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#minlength
     */
    minlength: {
        type: (StringConstructor | NumberConstructor)[];
        default: undefined;
    };
    /**
     * Input / Textarea maxlength
     * Maximum length (number of characters) of value
     * Available for input types: text, search, url, tel, email, password
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#maxlength
     */
    maxlength: {
        type: (StringConstructor | NumberConstructor)[];
        default: undefined;
    };
    /**
     * Input / Textarea placeholder
     * Text that appears in the form control when it has no value set
     * Available for input types: text, search, url, tel, email, password, number
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#placeholder
     */
    placeholder: {
        type: StringConstructor;
        default: undefined;
    };
    /**
     * The item label
     */
    label: {
        type: (StringConstructor | NumberConstructor)[];
        default: undefined;
    };
    /**
     * If true the label will be floating
     */
    floating: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * VvIcon name or props
     * @see VvIcon
     */
    icon: {
        type: PropType<string | VvIconProps>;
        default: undefined;
    };
    /**
     * VvIcon position
     */
    iconPosition: {
        type: PropType<`${Position}`>;
        default: Position;
        validation: (value: Position) => boolean;
    };
    /**
     * Milliseconds to wait before emitting the input event
     */
    debounce: {
        type: (StringConstructor | NumberConstructor)[];
        default: undefined;
    };
    /**
     * Show character limit
     */
    count: {
        type: (BooleanConstructor | StringConstructor)[];
        default: boolean;
        validator: (value: string) => boolean;
    };
    /**
     * Component BEM modifiers
     */
    modifiers: {
        type: PropType<string | string[]>;
        default: undefined;
    };
    /**
     * Loading status
     */
    loading: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Loading label
     */
    loadingLabel: {
        type: StringConstructor;
        default: string;
    };
    hintLabel: {
        type: StringConstructor;
        default: string;
    };
    /**
     * Invalid status
     */
    invalid: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Invalid label
     */
    invalidLabel: {
        type: (ArrayConstructor | StringConstructor)[];
        default: undefined;
    };
    /**
     * Valid status
     */
    valid: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Valid label
     */
    validLabel: {
        type: (ArrayConstructor | StringConstructor)[];
        default: undefined;
    };
    /**
     * The value is not editable
     */
    readonly: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Whether the form control is disabled
     */
    disabled: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Global attribute tabindex
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex
     */
    tabindex: {
        type: (StringConstructor | NumberConstructor)[];
        default: number;
    };
    /**
     * Global attribute autocomplete
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete
     */
    autocomplete: {
        type: StringConstructor;
        default: string;
    };
    /**
     * Global attribute autofocus
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus
     */
    autofocus: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Input / Textarea name
     * Name of the form control. Submitted with the form as part of a name/value pair
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name
     */
    name: {
        type: StringConstructor;
        required: boolean;
    };
    /**
     * Global attribute id
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id
     */
    id: (StringConstructor | NumberConstructor)[];
};
export declare const CheckboxRadioProps: {
    /**
     * Input value
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#value
     */
    value: {
        type: (BooleanConstructor | StringConstructor | NumberConstructor)[];
        default: undefined;
    };
    /**
     * Input value
     */
    modelValue: {
        type: (ObjectConstructor | BooleanConstructor | StringConstructor | NumberConstructor)[];
        default: undefined;
    };
    /**
     * Loading status
     */
    loading: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Loading label
     */
    loadingLabel: {
        type: StringConstructor;
        default: string;
    };
    /**
     * The item label
     */
    label: {
        type: (StringConstructor | NumberConstructor)[];
        default: undefined;
    };
    /**
     * Component BEM modifiers
     */
    modifiers: {
        type: PropType<string | string[]>;
        default: undefined;
    };
    /**
     * The value is not editable
     */
    readonly: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Whether the form control is disabled
     */
    disabled: {
        type: BooleanConstructor;
        default: boolean;
    };
    hintLabel: {
        type: StringConstructor;
        default: string;
    };
    /**
     * Invalid status
     */
    invalid: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Invalid label
     */
    invalidLabel: {
        type: (ArrayConstructor | StringConstructor)[];
        default: undefined;
    };
    /**
     * Valid status
     */
    valid: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Valid label
     */
    validLabel: {
        type: (ArrayConstructor | StringConstructor)[];
        default: undefined;
    };
    /**
     * Global attribute tabindex
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex
     */
    tabindex: {
        type: (StringConstructor | NumberConstructor)[];
        default: number;
    };
    /**
     * Input / Textarea name
     * Name of the form control. Submitted with the form as part of a name/value pair
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name
     */
    name: {
        type: StringConstructor;
        required: boolean;
    };
    /**
     * Global attribute id
     * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/id
     */
    id: (StringConstructor | NumberConstructor)[];
};
export declare const CheckboxRadioGroupProps: {
    /**
     * Input value
     */
    modelValue: {
        type: (SymbolConstructor | ArrayConstructor | BooleanConstructor | StringConstructor | NumberConstructor)[];
        default: undefined;
    };
    /**
     * Input name
     */
    name: {
        type: StringConstructor;
        required: boolean;
    };
    /**
     * If true, the group will be displayed in a vertical column
     */
    vertical: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Whether the form control is required
     */
    required: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Loading status
     */
    loading: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Loading label
     */
    loadingLabel: {
        type: StringConstructor;
        default: string;
    };
    /**
     * The item label
     */
    label: {
        type: (StringConstructor | NumberConstructor)[];
        default: undefined;
    };
    /**
     * Component BEM modifiers
     */
    modifiers: {
        type: PropType<string | string[]>;
        default: undefined;
    };
    /**
     * The value is not editable
     */
    readonly: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Whether the form control is disabled
     */
    disabled: {
        type: BooleanConstructor;
        default: boolean;
    };
    hintLabel: {
        type: StringConstructor;
        default: string;
    };
    /**
     * List of options, can be string[] or object[]
     */
    options: {
        type: PropType<(Option | string)[]>;
        default: () => never[];
    };
    /**
     * Used when options are objects: key to use for option label
     */
    labelKey: {
        type: (StringConstructor | FunctionConstructor)[];
        default: string;
    };
    /**
     * Used when options are objects: key to use for option label
     */
    valueKey: {
        type: (StringConstructor | FunctionConstructor)[];
        default: string;
    };
    /**
     * Used when options are objects: key to use for option disabled
     */
    disabledKey: {
        type: (StringConstructor | FunctionConstructor)[];
        default: string;
    };
    /**
     * Invalid status
     */
    invalid: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Invalid label
     */
    invalidLabel: {
        type: (ArrayConstructor | StringConstructor)[];
        default: undefined;
    };
    /**
     * Valid status
     */
    valid: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Valid label
     */
    validLabel: {
        type: (ArrayConstructor | StringConstructor)[];
        default: undefined;
    };
};
export declare const ActionProps: {
    /**
     * Button type
     */
    type: {
        type: PropType<`${ButtonType}`>;
        default: ButtonType;
        validator: (value: ButtonType) => boolean;
    };
    /**
     * Button aria-label
     */
    ariaLabel: {
        type: StringConstructor;
        default: undefined;
    };
    /**
     * Default tag for the action
     */
    defaultTag: {
        type: StringConstructor;
        default: ActionTag;
    };
    /**
     * The router-link/nuxt-link property, if it is defined the button is rendered as a ruouter-link or nuxt-link.
     * @see Documentation of [router-link](https://router.vuejs.org/api/#router-link) and [nuxt-link](https://nuxtjs.org/api/components-nuxt-link/)
     */
    to: {
        type: (ObjectConstructor | StringConstructor)[];
    };
    /**
     * Anchor href
     */
    href: StringConstructor;
    /**
     * Anchor target
     */
    target: StringConstructor;
    /**
     * Anchor rel
     */
    rel: {
        type: StringConstructor;
        default: string;
    };
    /**
     * Whether the item is current
     */
    current: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Whether the item is active
     */
    active: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * Whether the item is pressed
     */
    pressed: {
        type: BooleanConstructor;
        default: boolean;
    };
    /**
     * The item label
     */
    label: {
        type: (StringConstructor | NumberConstructor)[];
        default: undefined;
    };
    /**
     * Whether the form control is disabled
     */
    disabled: {
        type: BooleanConstructor;
        default: boolean;
    };
};
export declare const NavProps: {
    items: {
        type: PropType<NavItem[]>;
        default: () => never[];
    };
};
export declare const StorageProps: {
    storageType: {
        type: PropType<`${StorageType}`>;
        default: StorageType;
        validator: (value: StorageType) => boolean;
    };
    storageKey: StringConstructor;
};