import * as vue from 'vue';
import { ComponentObjectPropsOptions, Directive, DirectiveBinding, AllowedComponentProps, VNodeProps, AppConfig, Reactive, ObjectPlugin, Ref, Slots, VNodeArrayChildren, VNode, TransitionProps, ComponentInternalInstance, DefineComponent, ComputedOptions, MethodOptions, ComponentOptionsMixin, PublicProps, SlotsType, ComponentProvideOptions, ExtractDefaultPropTypes, ComputedRef, ComponentPublicInstance, RendererNode, ShallowReactive, Component, App } from 'vue';
import { RouteLocationAsRelativeGeneric, RouteLocationRaw, RouteLocationNormalizedLoaded, RouterLinkProps } from 'vue-router';
import { AxiosInstance, AxiosRequestConfig, AxiosResponse, AxiosError, RawAxiosRequestConfig, AxiosPromise } from 'axios';

declare type TSideDrawerPosition = 'left' | 'right';
declare type TSideDrawerProps = {
    miniWidth: number;
    width: number;
    mini: boolean;
    open: boolean;
};
declare type TSideDrawer = {
    [K in TSideDrawerPosition]: TSideDrawerProps;
};
declare type TSideDrawerOptionProps = {
    /**
     * Sets the component color.
     *
     * @deprecated
     * Use global CSS variables instead.
     */
    color?: string;
    /**
     * Cut off the top edge of the component.
     */
    clipped?: boolean;
    /**
     * Sets the component position fixed on the left or right side even when scrolling the page.
     */
    fixedLayout?: boolean;
    /**
     * The component minimize state.
     */
    mini?: boolean;
    /**
     * The component width in pixel when on minimize state.
     */
    miniWidth?: Numberish;
    /**
     * The component width in pixel when display as modal on small screen.
     */
    modalWidth?: Numberish;
    /**
     * The component state, show or hide. Monitored by `v-model`.
     */
    open?: boolean;
    /**
     * The backdrop overlay color when the component is displayed as modal.
     * The value must be in hexadecimal color format.
     */
    overlayColor?: string;
    /**
     * The component position location. Valid values are: `left`, `right`.
     */
    position?: TSideDrawerPosition;
    /**
     * Add shadow effect to the component.
     */
    shadow?: boolean;
    /**
     * Html tag used to render the component.
     */
    tag?: HtmlTagName | string;
    /**
     * The component width in pixel.
     */
    width?: Numberish;
};
declare type TBsSideDrawer = ComponentObjectPropsOptions<TSideDrawerOptionProps>;

declare type TNotificationPosition = 'top-right' | 'top-left' | 'top-center' | 'top-full-width' | 'bottom-right' | 'bottom-left' | 'bottom-center' | 'bottom-full-width';
declare type TNotificationVariant = 'default' | 'info' | 'success' | 'error' | 'warning' | 'custom';
declare type TNotificationOption = {
    message: string;
    oid?: string;
    title?: string;
    timeout?: number;
    variant?: TNotificationVariant;
    position?: TNotificationPosition;
    clickClose?: boolean;
    closeButton?: boolean;
    iconOff?: boolean;
    preventDuplicates?: boolean;
    progressBar?: boolean;
};
declare type TNotificationItemOptionProps = {
    variant: TNotificationVariant | string;
    message: string;
    title?: string;
    timeout?: number;
    clickClose?: boolean;
    closeButton?: boolean;
    iconOff?: boolean;
    progressBar?: boolean;
};
declare type TNotificationBarOptionProps = {
    timeout?: number;
    pause?: boolean;
};
declare type TBsNotificationItem = ComponentObjectPropsOptions<TNotificationItemOptionProps>;
declare type TBsNotificationBar = ComponentObjectPropsOptions<TNotificationBarOptionProps>;

declare interface INotificationProvider {
    /**
     * Get the notification data store.
     */
    get collection(): Map<TNotificationPosition, TNotificationOption[]>;
    /**
     * Create and display new Notification.
     *
     * @param data The notification to be added.
     */
    add(data: string | TNotificationOption): TNotificationOption | null;
    /**
     * Close all notification and remove from the DOM.
     */
    clearAll(): void;
    /**
     * Alias for {@link remove} method.
     *
     * @param item The notification to be removed.
     */
    close(item: TNotificationOption): void;
    /**
     * Close and remove a notification from the DOM.
     *
     * @param item The notification to be removed.
     */
    remove(item: TNotificationOption): void;
    /**
     * Close and remove notification by its variant.
     *
     * @param variant The notification variant to be removed.
     */
    removeByType(variant: TNotificationVariant): void;
    /**
     * Shortcut method to create and display Error Notification.
     *
     * @param data  The notification configuration or message.
     * @param title The notification title.
     */
    error(data: string | TNotificationOption, title?: string): TNotificationOption | null;
    /**
     * Shortcut method to create and display Info Notification.
     *
     * @param data  The notification configuration or message.
     * @param title The notification title.
     */
    info(data: string | TNotificationOption, title?: string): TNotificationOption | null;
    /**
     * Shortcut method to create and display Success Notification.
     *
     * @param data  The notification configuration or message.
     * @param title The notification title.
     */
    success(data: string | TNotificationOption, title?: string): TNotificationOption | null;
    /**
     * Shortcut method to create and display Warning Notification.
     *
     * @param data  The notification configuration or message.
     * @param title The notification title.
     */
    warning(data: string | TNotificationOption, title?: string): TNotificationOption | null;
}
declare class NotificationProvider implements INotificationProvider {
    private readonly _collection;
    constructor();
    get collection(): Map<TNotificationPosition, TNotificationOption[]>;
    add(data: string | TNotificationOption): TNotificationOption | null;
    clearAll(): void;
    close(item: TNotificationOption): void;
    private _deleteIfEmpty;
    remove(item: TNotificationOption): void;
    removeByType(variant: TNotificationVariant): void;
    error(data: string | TNotificationOption, title?: string): TNotificationOption | null;
    info(data: string | TNotificationOption, title?: string): TNotificationOption | null;
    success(data: string | TNotificationOption, title?: string): TNotificationOption | null;
    warning(data: string | TNotificationOption, title?: string): TNotificationOption | null;
    private _doAdd;
    private _createOption;
}

declare const ClickOutside: Directive<HTMLElement, TDirectiveBinding | VoidFunction, string, never>;

interface ResizeDirectiveBinding extends Omit<DirectiveBinding, 'modifiers'> {
    value: EventListenerTarget | TDirectiveBinding;
    modifiers?: {
        active?: boolean;
        quiet?: boolean;
    };
}
declare const Resize: Directive<HTMLElement, EventListenerTarget | TDirectiveBinding, string, never>;

interface ScrollDirectiveBinding extends Omit<DirectiveBinding, 'modifiers'> {
    value: EventListenerTarget | TDirectiveBinding;
    modifiers?: {
        passive?: boolean;
        self?: boolean;
    };
}
declare const Scroll: Directive<HTMLElement, EventListenerTarget | TDirectiveBinding, string, never>;

declare interface TouchDirectiveEvent {
    touchstartX: number;
    touchstartY: number;
    touchendX: number;
    touchendY: number;
    touchmoveX: number;
    touchmoveY: number;
    deltaX: number;
    deltaY: number;
    left?: (evt: TouchDirectiveEvent) => void;
    right?: (evt: TouchDirectiveEvent) => void;
    up?: (evt: TouchDirectiveEvent) => void;
    down?: (evt: TouchDirectiveEvent) => void;
    start?: (evt: TouchDirectiveEvent) => void;
    move?: (evt: TouchDirectiveEvent) => void;
    end?: (evt: TouchDirectiveEvent) => void;
}
declare interface TouchEventListener {
    touchstart(e: TouchEvent): void;
    touchend(e: TouchEvent): void;
    touchmove(e: TouchEvent): void;
}
declare interface TouchValueBinding {
    left?: (evt: TouchDirectiveEvent) => void;
    right?: (evt: TouchDirectiveEvent) => void;
    up?: (evt: TouchDirectiveEvent) => void;
    down?: (evt: TouchDirectiveEvent) => void;
    start?: (evt: TouchDirectiveEvent) => void;
    move?: (evt: TouchDirectiveEvent) => void;
    end?: (evt: TouchDirectiveEvent) => void;
}
declare interface TouchDirectiveBinding extends Omit<DirectiveBinding, 'modifiers'> {
    value: TouchValueBinding;
    modifiers?: {
        parent?: boolean;
        passive?: boolean;
    };
}
declare const Touch: Directive<HTMLElement, TouchValueBinding, string, never>;

declare type TBreakpoint = 'sm' | 'md' | 'lg' | 'xl' | 'xs';
declare type TContextColor = 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info' | 'default';
declare type TExtendedContextColor = 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info' | 'light' | 'default';
declare type HtmlTagName = 'div' | 'nav' | 'main' | 'header' | 'aside' | 'article' | 'section' | 'span' | 'h5' | 'h4' | 'h3' | 'h2' | 'h1' | 'p' | 'a';
declare type Numberish = number | string;
declare type MaybeNumberish = number | string | null | undefined;
declare type MaybeNumber = number | null | undefined;
declare type MaybeString = string | null | undefined;
declare type TRecord = Record<string, unknown>;
declare type TBooleanRecord = Record<string, boolean | undefined>;
declare type TClassList = string | string[] | TRecord;
declare interface TDirectiveBinding {
    handler: VoidFunction | EventListener | EventListenerTarget;
    debounce?: number;
    target?: string | Element | Document | Window;
}
declare type TRouterLinkProps = AllowedComponentProps & VNodeProps & {
    /**
     * Element ID
     */
    id?: string;
    /**
     * Absolute or relative URL.
     */
    href?: string;
    /**
     * Route Location the link should navigate to when clicked on.
     */
    to?: RouteLocationRaw;
    /**
     * Calls `router.replace` instead of `router.push`.
     */
    replace?: boolean;
    /**
     * Class to apply when the link is active
     */
    activeClass?: string;
    /**
     * Class to apply when the link is exact active
     */
    exactActiveClass?: string;
    onClick?: (evt: Event) => void;
};
declare type TRouterOptionProps = {
    /**
     * CSS class when element is active.
     */
    activeClass?: string;
    /**
     * Create `to` property for the `<RouterLink>` component,
     * if [vue-router](https://router.vuejs.org/) exist.
     */
    location?: RouteLocationAsRelativeGeneric;
    /**
     * Shortcut to create `to` property for the `<RouterLink>` component with only the given **path**,
     * if [vue-router](https://router.vuejs.org/) exist.
     */
    path?: string;
    /**
     * Shortcut to create `to` property for the `<RouterLink>` component with only the given
     * **path-name**, if [vue-router](https://router.vuejs.org/) exist.
     */
    pathName?: string;
    /**
     * Absolute or relative url when [vue-router](https://router.vuejs.org/) doesn't exist.
     */
    url?: string;
};
declare type TAppBar = {
    height: number;
    stickyTop: boolean;
    fixedTop: boolean;
};
declare type TVueMdbProps = {
    left: number;
    right: number;
    top: number;
    bottom: number;
    height: number;
    width: number;
    appbar: TAppBar;
    sideDrawer: TSideDrawer;
};
declare type TVueMdb = {
    app: Record<string, TVueMdbProps>;
    notification: INotificationProvider;
};
declare interface PromiseVoidFunction {
    (): Promise<void>;
}
declare interface EventListenerBinding {
    handler: EventListenerOrEventListenerObject;
    options?: AddEventListenerOptions;
    target?: Element | Window | null;
}
declare interface IEventListenerResult {
    remove(): void;
}
declare interface EventListenerTarget {
    (target: Element | Window | undefined | null, event: Event | undefined | null): void;
}
declare interface IMouseEvents {
    mouseEnter: IEventListenerResult;
    mouseLeave: IEventListenerResult;
    focus: IEventListenerResult;
    blur: IEventListenerResult;
}
declare interface IBindingElement extends Element {
    __clickOutsideListener?: EventListenerBinding;
    __scrollListener?: EventListenerBinding;
    __resizeListener?: EventListenerOrEventListenerObject | CallableFunction;
    __resizeListeners?: Array<CallableFunction>;
    __mouseEvents?: IMouseEvents;
    __touchEvents?: TouchEventListener | TRecord;
    __observer?: ResizeObserver;
}
declare interface IHTMLElement extends HTMLElement {
    attachEvent(type: string, callback: EventListenerOrEventListenerObject): void;
    detachEvent(type: string, callback: EventListenerOrEventListenerObject): void;
}

declare type FilterLogic = 'AND' | 'OR';
declare type FilterOperator = 'eq' | 'neq' | 'gt' | 'gte' | 'lt' | 'lte' | 'contains' | 'fts' | 'tsquery' | 'startsWith' | 'startswith' | 'startWith' | 'startwith' | 'endsWith' | 'endswith' | 'endWith' | 'endwith' | 'notin' | 'in';
declare type FilterOptions = {
    /**
     * Field name attribute for filter operation.
     */
    property: string;
    /**
     * Filter value.
     */
    value: string | number | boolean;
    /**
     * Filter operator, default: `eq`.
     */
    operator: FilterOperator;
    /**
     * ORM custom data type, ex: 'ulid'.
     */
    type?: string;
    /**
     * Optional logic operator to be used when combined with another filters.
     * If it is not defined, global filter logic will be used.
     */
    logic?: FilterLogic;
    /**
     * Optional, indicate the `value` is an expression or field expression.
     */
    expression?: boolean;
};
declare type SortDirection = 'asc' | 'desc';
declare type SortOption = {
    /**
     * Field name attribute for sorting operation.
     */
    property: string;
    /**
     * @deprecated
     * Use `property` instead.
     */
    field?: string;
    /**
     * Sort direction, valid values: `asc`, `desc`.
     */
    direction: SortDirection;
};
declare type HttpMethod = 'get' | 'GET' | 'delete' | 'DELETE' | 'head' | 'HEAD' | 'options' | 'OPTIONS' | 'post' | 'POST' | 'put' | 'PUT' | 'patch' | 'PATCH' | 'purge' | 'PURGE';
declare type UrlMethod = {
    url: string;
    method: HttpMethod;
};
declare type RestMethodOptions = {
    browse: HttpMethod;
    fetch: HttpMethod;
    save: HttpMethod;
    update: HttpMethod;
    delete: HttpMethod;
};
declare type RestPropConfig = {
    [P in keyof RestMethodOptions]?: UrlMethod | string;
};
declare type RestKey = Record<string, HttpMethod>;
declare type RestConfig = Record<keyof RestMethodOptions | string, string>;
declare type CSRFConfig = {
    url?: string;
    tokenName?: string;
    dataField?: string;
    /**
     * @deprecated
     * Backward compatibility.
     */
    responseField?: string;
    suffix?: boolean;
};
declare type QueryParameter = {
    page?: number;
    limit?: number;
    filters?: FilterOptions[];
    sorts?: SortOption[];
    logic: FilterLogic;
};
declare interface ObjectBase {
    /**
     * Cleaning up resources and dispose each property before destroying this object.
     */
    destroy(): void;
}

declare interface IRestAdapter {
    get adapterInstance(): AxiosInstance;
    /**
     * Perform REST request to the remote server.
     *
     * @param config    Request configuration
     * @param onRequest Promise function called before the request is made.
     * @param onSuccess Promise function called when the request is successful.
     * @param onFailure Promise function called when the request is failed.
     */
    request(config: AxiosRequestConfig, onRequest: () => boolean, onSuccess: (response: AxiosResponse) => void, onFailure: (error: AxiosError) => void): Promise<AxiosResponse>;
    /**
     * Get REST request methods options.
     */
    requestMethods(): RestMethodOptions;
}
/**
 * Class RestProxyAdapter which is used to load data from the remote server.
 *
 * @author Ahmad Fajar
 * @since  20/07/2018 modified: 30/04/2026 17:39
 */
declare class RestProxyAdapter implements IRestAdapter {
    private readonly _adapter;
    private readonly _httpMethods;
    /**
     * Check if axios plugin already installed and defined not.
     *
     * @param appConfig AppConfig or Axios adapter instance
     * @throws Error If axios doesn't exist
     */
    static checkAxios(appConfig: AppConfig | AxiosInstance): void;
    /**
     * Check if Rest URL already defined or not.
     *
     * @param restUrl The Rest URL to check
     * @throws URIError If Rest Url is not defined
     */
    static checkRestUrl(restUrl: TRecord): void;
    /**
     * Log error response to the console.
     *
     * @param error The axios error object.
     */
    static warnResponseError(error: AxiosError): void;
    /**
     * Default REST request method options. Do not override this property.
     *
     * @returns REST method options
     */
    static get defaultHttpMethods(): RestMethodOptions;
    /**
     * Class constructor.
     *
     * @param adapter      Axios adapter instance
     * @param httpMethods  Custom HTTP methods to override the default methods
     */
    constructor(adapter?: AxiosInstance | null, httpMethods?: RestKey);
    get adapterInstance(): AxiosInstance;
    /**
     * Perform REST request to the server.
     *
     * @param config     Request configuration
     * @param onRequest  Promise function called before the request is made.
     * @param onSuccess  Promise function called when the request was successful.
     * @param onFailure  Promise function called when the request was failed.
     * @returns Promise interface instance
     */
    request(config: AxiosRequestConfig, onRequest: () => boolean, onSuccess: (response: AxiosResponse) => void, onFailure: (error: AxiosError) => void): Promise<AxiosResponse>;
    /**
     * Get REST request methods options.
     *
     * @returns REST request method options
     */
    requestMethods(): RestMethodOptions & RestKey;
}

declare type ModelConfig = {
    schema: TRecord;
    proxy: RestPropConfig;
    csrfConfig?: CSRFConfig;
};
declare type ModelState = {
    loading: boolean;
    updating: boolean;
    deleting: boolean;
    hasError: boolean;
};
declare type PlainModel<T extends TRecord = TRecord> = {
    [P in keyof T]: T[P];
} & {
    [key: string]: unknown;
};
declare interface DataModel<T> extends ObjectBase {
    [key: string]: unknown;
    /**
     * Returns the reactive state of the DataModel.
     */
    readonly state: Readonly<ModelState>;
    /**
     * Get/Override CSRF configuration in the form `{key: value}`, where the keys are:
     * `url`, `tokenName`, `dataField`, `suffix`.
     *
     * For backward compatibility you can override this function
     * as needed on the inheritance class or put it on the constructor
     * of the inheritance class or when instantiate the model.
     *
     * @example
     * return {
     *    'url'       : '/api/token/{name}',
     *    'tokenName' : 'token_name',
     *    'dataField' : 'token',
     *    'suffix'    : false
     * }
     */
    readonly csrfConfig: Readonly<CSRFConfig> | undefined;
    /**
     * Get REST proxy adapter which is used to work with remote service.
     */
    readonly proxy: IRestAdapter;
    /**
     * Get/Set REST URL configuration in the form `{key: url}`,
     * where the keys are: `save`, `fetch`, `delete`, `update`.
     *
     * For backward compatibility you can override this function
     * as needed on the inheritance class or put it on the constructor
     * of the inheritance class or when instantiate the model.
     *
     * @example
     * return {
     *    'save'  : '/api/user/create',
     *    'fetch' : '/api/user/{id}',
     *    'update': '/api/user/{id}/save',
     *    'delete': '/api/user/{id}/delete'
     * }
     */
    get restUrl(): RestConfig;
    set restUrl(option: RestConfig);
    /**
     * Readonly data Model state, whether it is still loading data or not.
     */
    readonly loading: boolean;
    /**
     * Readonly data Model state, whether it is still in the process of
     * saving/updating data to the remote server or not.
     */
    readonly updating: boolean;
    /**
     * Readonly data Model state, whether it is still in the process of deleting
     * data from the remote server or not.
     */
    readonly deleting: boolean;
    /**
     * Readonly data Model state, whether there was an error when
     * loading/saving/deleting data or not.
     */
    readonly hasError: boolean;
    /**
     * Assign new value to an existing field name.
     *
     * @param field     The field name
     * @param newValue  The new value
     */
    assignValue(field: string, newValue: unknown): void;
    /**
     * Assign new values to some existing fields.
     *
     * This method checked the schema definition when constructing the object,
     * and only fields that exists on the schema will get assign new value.
     *
     * @param sources Object with format key-value pairs
     */
    assignValues(sources: TRecord): void;
    /**
     * Perform delete record that already exists on the remote service via REST API.
     */
    delete(): Promise<AxiosResponse>;
    /**
     * Perform fetch or read record from remote service via REST API.
     *
     * @param id The item ID
     */
    fetch(id?: Numberish): Promise<AxiosResponse>;
    /**
     * Freeze this data model instance, makes it Readonly and prevents any modification.
     */
    freeze(): Readonly<DataModel<T>>;
    /**
     * Get a field value.
     *
     * @param key The field name.
     */
    get(key: keyof T): unknown;
    get(key: string): unknown;
    /**
     * Define or sets a field with new value.
     * If the field doesn't exist, then it will be appended.
     *
     * @param key   The field name.
     * @param value The field value.
     * @throws Error If this data model is frozen.
     */
    set(key: keyof T, value: unknown): void;
    set(key: string, value: unknown): void;
    /**
     * Get all the field names.
     */
    getFields(): IterableIterator<string>;
    /**
     * Returns the ID field name for this data model.
     */
    readonly idProperty: string;
    /**
     * Get ID field name for this data model. (for backward compatibility)
     *
     * @deprecated
     */
    getIdProperty(): string;
    /**
     * Perform custom HTTP request to the remote service via REST API.
     *
     * @param restKey    The key from restUrl property
     * @param method     Any valid HTTP method, likes: `get`, `post`, `delete`, `put`, `patch`.
     *                   The default is `get`.
     * @param params     Parameters to append when invoke rest request
     * @param data       Data to append when invoke rest request
     * @param successCb  Promise function to be called when the request is successful
     * @param errorCb    Promise function to be called when the request is failed
     */
    request(restKey: keyof RestMethodOptions, method?: HttpMethod | null, params?: TRecord | null, data?: TRecord | null, successCb?: ResponseCallbackFn, errorCb?: ResponseErrorCallbackFn): Promise<AxiosResponse>;
    /**
     * Reset all fields value to their default.
     */
    reset(): void;
    /**
     * Reset this model state back to their initial states, such as `loading`, etc.
     */
    resetState(): void;
    /**
     * Persist new record to the remote service via REST API.
     */
    save(): Promise<AxiosResponse>;
    /**
     * Seal this data model instance, preventing new properties from being added to it
     * and marking all existing properties as non-configurable.
     *
     * Values of present properties can still be changed as long as they are writable.
     */
    seal(): DataModel<T>;
    /**
     * Convert field attributes that exists in the schema definition into a JavaScript plain object.
     *
     * The result of this method is used on REST method like: {@link save } and {@link update }.
     *
     * This method can be overridden on inherited classes to produce the desired DTO.
     */
    toObject(): TRecord;
    /**
     * Update and persist record that already exists on the remote service via REST API.
     */
    update(): Promise<AxiosResponse>;
    /**
     * Event triggered after data was fetched from the remote server.
     * This method can be overridden on inherited classes.
     *
     * @param data The response data
     */
    onAfterFetch?(data: TRecord): void;
}
declare type TBsModel<T extends TRecord = TRecord> = DataModel<T> & {
    [P in keyof T]: T[P];
};
/**
 * Data Model class for working with entity object and remote API.
 *
 * @example
 * const model1 = new BsModel({
 *     uid: null,
 *     username: null,
 *     displayName: null,
 *     email: null,
 *     phoneNumber: null,
 *     enabled: true,
 *     password: null
 * }, adapter, 'uid');
 *
 * const model2 = new BsModel({
 *     schema: {
 *         uid: null,
 *         username: null,
 *         displayName: null,
 *         email: null,
 *         phoneNumber: null,
 *         enabled: true,
 *         password: null
 *     },
 *     proxy: {
 *         save: {url: './api/users', method: 'post'},
 *         update: {url: './api/users', method: 'patch'},
 *         delete: {url: './api/users', method: 'delete'},
 *         fetch: './api/users/{id}',
 *     },
 *     csrfConfig: {
 *         url: '/api/token/{name}',
 *         tokenName: 'token_name',
 *         dataField: 'value',
 *         suffix: false,
 *     },
 * }, adapter, 'uid');
 *
 * @author Ahmad Fajar
 * @since  09/07/2018 modified: 01/05/2026 14:38
 */
declare class BsModel<T extends TRecord = TRecord> implements DataModel<T> {
    private readonly _idProperty;
    private readonly _dataProperty;
    private readonly _csrfConfig;
    private readonly _data;
    private readonly _proxy;
    private _restUrl;
    private _schema;
    protected _state: Reactive<ModelState>;
    state: Readonly<ModelState>;
    [key: string]: unknown;
    /**
     * Construct new {@link BsModel} object instance.
     *
     * @param schema       The data model schema
     * @param adapter      Axios adapter instance
     * @param idProperty   Data model ID field name
     * @param dataProperty REST response data property
     *
     * @example
     * const model1 = new BsModel({
     *     uid: null,
     *     username: null,
     *     displayName: null,
     *     email: null,
     *     phoneNumber: null,
     *     enabled: true,
     *     password: null
     * }, adapter, 'uid');
     *
     * const model2 = new BsModel({
     *     schema: {
     *         uid: null,
     *         username: null,
     *         displayName: null,
     *         email: null,
     *         phoneNumber: null,
     *         enabled: true,
     *         password: null
     *     },
     *     proxy: {
     *         save: {url: './api/users', method: 'post'},
     *         update: {url: './api/users', method: 'patch'},
     *         delete: {url: './api/users', method: 'delete'},
     *         fetch: './api/users/{id}',
     *     },
     *     csrfConfig: {
     *         url: '/api/token/{name}',
     *         tokenName: 'token_name',
     *         dataField: 'value',
     *         suffix: false,
     *     },
     * }, adapter, 'uid');
     */
    constructor(schema: ModelConfig | TRecord, adapter?: AxiosInstance | null, idProperty?: string, dataProperty?: string);
    onAfterFetch?(_data: TRecord): void;
    private _initSchema;
    /**
     * Get the class name of this instance.
     */
    get $_class(): string;
    /**
     * Get/Override CSRF configuration in the form `{key: value}`, where the keys are:
     * `url`, `tokenName`, `dataField`, `suffix`.
     *
     * @example
     * return {
     *    'url'       : '/api/token/{name}',
     *    'tokenName' : 'token_name',
     *    'dataField' : 'token',
     *    'suffix'    : false
     * }
     */
    get csrfConfig(): Readonly<CSRFConfig> | undefined;
    get proxy(): IRestAdapter;
    /**
     * Get/Set REST URL configuration in the form `{key: url}`,
     * where the keys are: `save`, `fetch`, `delete`, `update`.
     *
     * For backward compatibility you can override this function
     * as needed on the inheritance class or put it on the constructor
     * of the inheritance class or when instantiate the model.
     *
     * @example
     * return {
     *    'save'  : '/api/user/create',
     *    'fetch' : '/api/user/{id}',
     *    'update': '/api/user/{id}/save',
     *    'delete': '/api/user/{id}/delete'
     * }
     */
    get restUrl(): RestConfig;
    set restUrl(option: RestConfig);
    get loading(): boolean;
    get updating(): boolean;
    get deleting(): boolean;
    get hasError(): boolean;
    destroy(): void;
    assignValue(field: string, newValue: unknown): void;
    assignValues(sources: TRecord): void;
    delete(): Promise<AxiosResponse>;
    fetch(id?: string | number): Promise<AxiosResponse>;
    get(key: keyof T | string): unknown;
    set(key: keyof T | string, value: unknown): void;
    getFields(): IterableIterator<string>;
    get idProperty(): string;
    /**
     * @deprecated
     */
    getIdProperty(): string;
    request(restKey: keyof RestMethodOptions, method?: HttpMethod | null, params?: TRecord | null, data?: TRecord | null, successCb?: ResponseCallbackFn, errorCb?: ResponseErrorCallbackFn): Promise<AxiosResponse>;
    reset(): void;
    resetState(): void;
    freeze(): Readonly<DataModel<T>>;
    seal(): DataModel<T>;
    private _prepareSaveOrUpdate;
    save(): Promise<AxiosResponse>;
    update(): Promise<AxiosResponse>;
    toObject(): TRecord;
    /**
     * Assign data from the remote source to this model.
     *
     * @param response A response object
     */
    protected _assignFromResponse(response: AxiosResponse): void;
    /**
     * @returns TRUE if this data model is not in delete state.
     */
    protected _checkBeforeDelete(): boolean;
    /**
     * @returns TRUE if this data model is not in loading state.
     */
    protected _checkBeforeLoading(): boolean;
    /**
     * @returns TRUE if this data model is not in the process of
     * saving its data to the remote source
     */
    protected _checkBeforeSave(): boolean;
    /**
     * A callback when delete request is failed.
     *
     * @param error The error object
     */
    protected _onDeleteFailure(error: AxiosError): void;
    /**
     * A callback when delete request is successful.
     */
    protected _onDeleteSuccess(): void;
    /**
     * A callback when remote data is failed to load.
     *
     * @param error The error object
     */
    protected _onLoadingFailure(error: AxiosError): void;
    /**
     * A callback when remote data is successfully loaded.
     *
     * @param response A response object
     */
    protected _onLoadingSuccess(response: AxiosResponse): void;
    /**
     * A callback when saving data to the remote source is failed.
     *
     * @param error The error object
     */
    protected _onSaveFailure(error: AxiosError): void;
    /**
     * A callback when data is successfully saved to the remote source.
     *
     * @param response A response object
     */
    protected _onSaveSuccess(response: AxiosResponse): void;
    /**
     * Make http request and inject CSRF Token to the headers.
     *
     * @param config     Request configuration
     * @param onRequest  Callback function before the request is made
     * @param onSuccess  Callback function when the request was successful
     * @param onFailure  Callback when the request failed
     * @param suffix     Suffix to be appended to the token-name
     * @returns Promise interface
     */
    protected _requestWithToken(config: AxiosRequestConfig, onRequest: () => boolean, onSuccess: (response: AxiosResponse) => void, onFailure: (error: AxiosError) => void, suffix?: string): Promise<AxiosResponse>;
    /**
     * Update request configuration.
     *
     * @param config      Request configuration to be updated
     * @param identifier  The value to be included in the configuration
     * @param url         API URL
     * @param method      Request method: delete, fetch, save, update
     */
    private _updateRequestConfig;
}

declare type DataStoreConfig = TRecord & {
    idProperty?: string;
    dataProperty?: string;
    totalProperty?: string;
    pageSize?: number;
    remoteFilter?: boolean;
    remotePaging?: boolean;
    remoteSort?: boolean;
    restProxy?: RestPropConfig;
    csrfConfig?: CSRFConfig;
    filterLogic?: FilterLogic;
    filters?: FilterOptions[];
    sortOptions?: SortOption[];
};
declare type DataStoreState = ModelState & {
    length: number;
    totalCount: number;
    currentPage: number;
};
declare type ListenerFn<T> = (arg: T) => void;
declare type LoadedCallbackFn<T extends TRecord> = (data: TBsModel<T>[]) => void;
declare type ResponseCallbackFn = (response: AxiosResponse) => void;
declare type ResponseErrorCallbackFn = (error: AxiosError) => void;
declare type ResponseLike<T extends TRecord> = (TBsModel<T> | PlainModel<T>)[] | AxiosResponse;
/**
 * Class AbstractStore is superclass of {@link BsArrayStore}, and {@link BsStore}.
 * It's never used directly, but offers a set of methods used by those subclasses.
 *
 * @author Ahmad Fajar
 * @since  15/03/2019 modified: 30/04/2026 09:19
 */
declare abstract class AbstractStore<T extends TRecord> implements ObjectBase {
    private _eventMap;
    protected _config: DataStoreConfig;
    protected _filters: FilterOptions[];
    protected _filteredItems: (TBsModel<T> | PlainModel<T>)[];
    protected _items: (TBsModel<T> | PlainModel<T>)[];
    protected _proxy: IRestAdapter | undefined;
    protected _state: Reactive<DataStoreState>;
    /**
     * Returns the reactive state of the DataStore.
     */
    storeState: Readonly<Reactive<DataStoreState>>;
    /**
     * Check if the given item is a data model or not.
     *
     * @param item The item to check
     * @returns TRUE if the given item is a data model otherwise FALSE
     */
    static isModel<P>(item: unknown): item is DataModel<P>;
    static isCandidateForFilterOption(item: TRecord): item is FilterOptions;
    static isCandidateForSortOption(item: TRecord): item is SortOption;
    /**
     * Construct new {@link AbstractStore} object instance.
     *
     * @param config  The configuration properties
     */
    protected constructor(config?: DataStoreConfig);
    /**
     * Get the class name of this instance.
     */
    get $_class(): string;
    destroy(): void;
    /**
     * Clear all data items in the local storage and reset data store state.
     */
    clear(): void;
    /**
     * @deprecated
     * Use `clear` instead.
     */
    clearData(): void;
    /**
     * Readonly data Model state, whether it is still loading data or not.
     */
    get loading(): boolean;
    /**
     * Readonly data Model state, whether it is still in the process of
     * saving/updating data to the remote server or not.
     */
    get updating(): boolean;
    /**
     * Readonly data Model state, whether it is still in the process of deleting
     * data from the remote server or not.
     */
    get deleting(): boolean;
    /**
     * Readonly data Model state, whether there was an error when
     * loading/saving/deleting data or not.
     */
    get hasError(): boolean;
    /**
     * Returns the axios plugin adapter.
     */
    get adapterInstance(): AxiosInstance | undefined;
    /**
     * Get REST proxy adapter which is used to work with remote service.
     */
    get proxy(): IRestAdapter | undefined;
    /**
     * Get REST URL configuration in the form `{key: url}`,
     * where the keys are: `save`, `fetch`, `delete`, `update`.
     *
     * For backward compatibility you can override this function
     * as needed on the inheritance class or put it on the constructor
     * of the inheritance class or when instantiate the model.
     *
     * @example
     * return {
     *    'save'  : '/api/user/create',
     *    'fetch' : '/api/user/{id}',
     *    'update': '/api/user/{id}/save',
     *    'delete': '/api/user/{id}/delete'
     * };
     *
     * // This is an example of the returns data
     */
    get restUrl(): RestConfig | undefined;
    set restUrl(option: RestConfig);
    /**
     * Returns active page number (base-1 index).
     */
    get currentPage(): number;
    /**
     * Get/Set the number of items within a page.
     */
    get pageSize(): number;
    set pageSize(value: number);
    /**
     * Returns the number of items on the active page.
     */
    get length(): number;
    /**
     * Returns total number of items in the Store's dataset. (readonly)
     */
    get totalCount(): number;
    /**
     * Returns total number of pages.
     */
    get totalPages(): number;
    /**
     * Get/Set the default filters.
     */
    get defaultFilters(): FilterOptions[];
    set defaultFilters(values: FilterOptions[] | FilterOptions);
    /**
     * Get/Set the collection of filters to be used.
     */
    get filters(): FilterOptions[];
    set filters(newFilters: FilterOptions[] | FilterOptions);
    /**
     * Register event listener.
     *
     * @param event The event name, valid values are: `error`, and `loaded`.
     * @param fn    The event callback function.
     */
    addListener<T>(event: string, fn: ListenerFn<T>): void;
    /**
     * Shortcut function to register `error` event listener.
     *
     * @param fn Callback function when error occurred.
     */
    onError(fn: ResponseErrorCallbackFn): void;
    /**
     * Shortcut function to register `loaded` event listener.
     *
     * @param fn Callback function when data is successfully loaded to this store dataset.
     */
    onLoaded(fn: LoadedCallbackFn<T>): void;
    /**
     * Add a filter to the Store.
     *
     * @param field     The field name to which the filter will be applied.
     * @param value     The filter value
     * @param operator  Filter operator to be used, valid values: `eq`, `neq`, `gt`, `gte`,
     *                  `lt`, `lte`, `in`, `notin`, `startwith`, `endwith`, `contains`, `fts`
     * @param type      Optional, ORM custom data type
     * @param logic     Optional, logic to be used when mixing two or more filters.
     */
    addFilter(field: string, value: string | number | boolean, operator?: FilterOperator, type?: string, logic?: FilterLogic): this;
    /**
     * Replace old filters and apply new filters to the Store dataset.
     *
     * @param newFilters     The filters to apply
     * @param includeDefault Include default filters or not
     */
    setFilters(newFilters: FilterOptions[] | FilterOptions, includeDefault?: boolean): this;
    /**
     * Define the filter logic to be used when filtering the Store’s dataset.
     *
     * @param logic The filter logic, valid values: 'AND', 'OR'
     */
    setFilterLogic(logic: FilterLogic): this;
    /**
     * Get/Set the sorter's object collection to be used
     * when sorting the Store's dataset.
     */
    get sorters(): SortOption[];
    set sorters(sortOptions: SortOption[] | SortOption);
    /**
     * Reset this data store state back to its initial states, like `loading`, etc.
     */
    resetState(): void;
    /**
     * Finds the first matching item in the local dataset by a specific field value.
     *
     * @param property    The field name to test
     * @param value       The value to match
     * @param startIndex  The index to start searching at
     */
    find(property: string, value: unknown, startIndex?: number): TBsModel<T> | PlainModel<T> | undefined;
    /**
     * Finds the first matching item in the local dataset by function's predicate.
     * If the predicate returns `true`, it is considered a match.
     *
     * @param predicate  Function to execute on each value in the array
     * @returns The item of the first element in the array that satisfies
     * the provided testing function. Otherwise, `undefined` is returned.
     */
    findBy(predicate: (value: TBsModel<T> | PlainModel<T>, index: number) => boolean): TBsModel<T> | PlainModel<T> | undefined;
    /**
     * Finds the index of the first matching Item in the local dataset by a specific field value.
     *
     * @param property   The field name to test
     * @param value      The value to match
     * @param startIndex The index to start searching at
     * @returns The index of first match element, otherwise -1
     */
    findIndex(property: string, value: unknown, startIndex?: number): number;
    /**
     * Filter the dataset locally and returns new array with
     * all elements that pass the test.
     */
    localFilter(): (TBsModel<T> | PlainModel<T>)[];
    /**
     * Sorts the dataset locally and returns new sorted dataset.
     */
    localSort(): (TBsModel<T> | PlainModel<T>)[];
    /**
     * Check if the data in the local dataset is empty or not.
     */
    isEmpty(): boolean;
    /**
     * Sets the current active page.
     *
     * @param value The new page number, based-1 index.
     */
    page(value: number): AbstractStore<T>;
    /**
     * Marks data Store to load the previous page.
     */
    previousPage(): AbstractStore<T>;
    /**
     * Marks data Store to load the next page.
     */
    nextPage(): AbstractStore<T>;
    /**
     * Check if the given item is a DataModel or not.
     *
     * @param item The item to be checked
     */
    isCandidateForModel(item: TRecord): item is TBsModel<T> | PlainModel<T>;
    /**
     * Removes the specified item(s) from the internal dataset.
     *
     * @param items Model instance or array of model instances to be removed
     */
    remove<P extends TBsModel<T> | PlainModel<T>>(items: P | P[]): void;
    /**
     * Removes the model instance(s) at the given index from the internal dataset.
     *
     * @param index Starting index position
     * @param count Number of items to delete
     */
    removeAt(index: number, count?: number): void;
    /**
     * Set the number of items within a page.
     *
     * @param value Number of items within a page
     */
    setPageSize(value: number): this;
    /**
     * Set sorter's criteria collection.
     *
     * @param sortOptions One or more sorting method criteria(s).
     */
    setSorters(sortOptions: SortOption[] | SortOption): this;
    /**
     * Create an array of FilterOption criteria.
     *
     * @param values  An array of filter options configuration.
     */
    createFilters(values: FilterOptions | FilterOptions[]): FilterOptions[];
    /**
     * Create an array of SortOption criteria.
     *
     * @param property  The field name to sort or sort method criteria.
     * @param direction The sort direction.
     * @param replace   Replace existing sort criteria or not.
     */
    createSorters(property: string | string[] | SortOption | SortOption[], direction?: SortDirection, replace?: boolean): SortOption[];
    /**
     * Create new DataModel from the given object.
     *
     * @param item The data to convert
     */
    createModel<P extends PlainModel<T>>(item: P): TBsModel<T>;
    /**
     * Get current query parameter's configuration.
     */
    queryParams(): QueryParameter;
    /**
     * Load data from the remote server or from the given record(s) and
     * replace internal dataset with the new dataset.
     *
     * @param data The record(s) to be assigned
     */
    abstract load(data?: unknown): Promise<ResponseLike<T>>;
    /**
     * Returns dataset from the active page.
     *
     * If a filter or sorter has been applied before,
     * then the returned dataset will also be affected by it.
     */
    abstract get dataItems(): (TBsModel<T> | PlainModel<T>)[];
    /**
     * Append an item to the local dataset.
     *
     * @param item   The Data to append to the dataset
     * @param force  Force adds even if the data supplied
     *               is not suitable for the Data Model
     * @param silent Append data silently and doesn't trigger length counting
     */
    protected _append<P extends PlainModel<T>>(item: P, force?: boolean, silent?: boolean): void;
    /**
     * Assign data to the local dataset and replace the old dataset.
     *
     * @param source  A record or collection of records to be assigned
     * @param silent  Append data silently and doesn't trigger data conversion
     */
    protected _assignData(source: unknown, silent?: boolean): void;
    /**
     * @returns TRUE if this data store is not in loading state.
     */
    protected _checkBeforeLoading(): boolean;
    /**
     * Callback function when error loading the dataset from the remote service.
     *
     * @param error The error object
     */
    protected _onLoadingFailure(error: AxiosError): void;
    /**
     * Callback function when success loading the dataset from the remote service.
     */
    protected _onLoadingSuccess(): void;
    protected _fireEvent<T>(event: string, arg: T): void;
}

declare interface IArrayStore<T extends TRecord = TRecord> extends AbstractStore<T> {
    /**
     * Returns dataset from the active page.
     *
     * If a filter or sorter has been applied before,
     * then the returned dataset will also be affected by it.
     */
    get dataItems(): TBsModel<T>[];
    /**
     * Calculate means or average value based on the given field.
     *
     * @param field The field name of the dataset to calculate
     */
    aggregateAvg(field: string): number;
    /**
     * Count number of items in the internal dataset specified by the given criteria.
     *
     * @param field The grouping field name criteria
     * @param value  The grouping value criteria
     */
    aggregateCountBy(field: string, value: unknown): number;
    /**
     * Calculate the SUM or total value based on the given field.
     *
     * @param field The field name to be used when calculating value
     */
    aggregateSum(field: string): number;
    /**
     * Append an item to the internal dataset and sorted if needed.
     *
     * @param item    Data to append to the Store
     * @param sorted  Sort dataset after appended
     */
    append<P extends PlainModel<T>>(item: P, sorted?: boolean): void;
    /**
     * Replace the dataset with new data.
     *
     * @param data   The new data to be assigned
     * @param silent Append the data silently and don't trigger data transformer
     */
    assignData(data: unknown, silent?: boolean): void;
    /**
     * Load and replace internal dataset with the given data.
     *
     * @param data The new data to replace the internal dataset.
     */
    load(data?: unknown): Promise<TBsModel<T>[]>;
    /**
     * Sorts the internal dataset with the given criteria and returns
     * the reference of the internal dataset.
     *
     * @param options    The field for sorting or `TSortOption` objects
     * @param direction  The sort direction
     * @returns The sorted dataset.
     *
     * @example
     * // sort by a single field
     * const results = await myStore.sort('myField', 'asc');
     *
     * // sorting by multiple fields
     * const results = await myStore.sort([
     *  {property: 'age', direction: 'desc'},
     *  {property: 'name', direction: 'asc'}
     * ]);
     */
    sort(options: string | string[] | SortOption | SortOption[], direction?: SortDirection): Promise<TBsModel<T>[]>;
}
/**
 * Data store class to work with collection of entity objects locally.
 *
 * @example
 * const myStore = new BsArrayStore(
 *   [
 *     {id: 1, name: 'Sandra Adams'},
 *     {id: 2, name: 'Ali Connors'},
 *     {id: 3, name: 'Trevor Hansen'},
 *     {id: 4, name: 'Tucker Smith'},
 *     {id: 5, name: 'Britta Holt'},
 *     {id: 6, name: 'Jane Smith'},
 *     {id: 7, name: 'John Smith'},
 *     {id: 8, name: 'Sandra Williams'}
 *   ], {
 *     idProperty: 'id'
 *   }
 * );
 *
 * @author Ahmad Fajar
 * @since  13/03/2019 modified: 30/04/2026 09:29
 */
declare class BsArrayStore<T extends TRecord = TRecord> extends AbstractStore<T> implements IArrayStore<T> {
    /**
     * Construct new {@link BsArrayStore} object instance.
     *
     * @param data   Collection of records to be assigned
     * @param config The configuration properties
     *
     * @example
     * const myStore = new BsArrayStore(
     *   [
     *     {id: 1, name: 'Sandra Adams'},
     *     {id: 2, name: 'Ali Connors'},
     *     {id: 3, name: 'Trevor Hansen'},
     *     {id: 4, name: 'Tucker Smith'},
     *     {id: 5, name: 'Britta Holt'},
     *     {id: 6, name: 'Jane Smith'},
     *     {id: 7, name: 'John Smith'},
     *     {id: 8, name: 'Sandra Williams'}
     *   ], {
     *     idProperty: 'id'
     *   }
     * );
     */
    constructor(data: unknown[], config?: DataStoreConfig);
    get dataItems(): TBsModel<T>[];
    aggregateAvg(field: string): number;
    aggregateCountBy(field: string, value: unknown): number;
    aggregateSum(field: string): number;
    append<P extends PlainModel<T>>(item: P, sorted?: boolean): void;
    assignData(data: unknown, silent?: boolean): void;
    load(data?: unknown): Promise<TBsModel<T>[]>;
    sort(options: string | string[] | SortOption | SortOption[], direction?: SortDirection): Promise<TBsModel<T>[]>;
}

declare type MessageResponse = {
    success: boolean;
    message: string;
};
declare interface IBsStore<T extends TRecord = TRecord> extends AbstractStore<T> {
    /**
     * Returns dataset from the active page.
     *
     * If a filter or sorter has been applied before,
     * then the returned dataset will also be affected by it.
     */
    readonly dataItems: TBsModel<T>[];
    /**
     * Check if the data Store is using server filtering or local filtering.
     */
    get remoteFilter(): boolean;
    /**
     * Enable or disable data Store server filtering.
     *
     * @param {boolean} value If TRUE then using local filtering and FALSE otherwise
     */
    set remoteFilter(value: boolean);
    /**
     * Check if the data Store is using server paging or local paging.
     */
    get remotePaging(): boolean;
    /**
     * Enable or disable data Store server paging.
     *
     * @param value If TRUE then using server paging and FALSE otherwise
     */
    set remotePaging(value: boolean);
    /**
     * Check if the Store is using server sorting or local sorting.
     */
    get remoteSort(): boolean;
    /**
     * Enable or disable data Store server sorting.
     *
     * @param value If TRUE then using server sorting and FALSE otherwise
     */
    set remoteSort(value: boolean);
    /**
     * Calculate means or average value based on the given field.
     *
     * @param field The field name of the dataset to calculate.
     */
    aggregateAvg(field: string): number;
    /**
     * Count number of items in the internal dataset specified by the given criteria.
     *
     * @param field The grouping field name criteria.
     * @param value The grouping value criteria.
     */
    aggregateCountBy(field: string, value: unknown): number;
    /**
     * Calculate the SUM or total value based on the given field.
     *
     * @param field The field name to be used when calculating value.
     */
    aggregateSum(field: string): number;
    /**
     * Append an item to the internal dataset and also save the item as a new record to the
     * remote server whenever possible. The item can be saved to the remote server,
     * if `restUrl` property contains a `save` key.
     *
     * @param item Data to append to the internal dataset
     * @see {@link restUrl} property
     */
    append(item: TRecord): void;
    /**
     * Replace internal dataset with new data. The proses only affected the internal dataset
     * and nothing is sent to the remote service.
     *
     * @param data   The new data to be assigned.
     * @param silent Append the data silently and don't trigger data transformer.
     */
    assignData(data: unknown, silent?: boolean): void;
    /**
     * Delete specific item from internal dataset as well as from remote service whenever possible.
     * The item can be deleted from the remote service, if `restUrl` property contains a `delete` key.
     *
     * @param item Data Model instance to be removed
     * @see {@link restUrl} property
     */
    delete<P extends TBsModel<T>>(item: P): Promise<AxiosResponse | MessageResponse>;
    /**
     * Delete specific items from internal dataset as well as from remote
     * service whenever possible. The items can be deleted from the remote
     * service, if `restUrl` property contains a `delete` key.
     *
     * @param items Collection of data Model instances to be removed
     * @see {@link restUrl} property
     */
    deletes<P extends TBsModel<T>>(items: P[]): Promise<MessageResponse>;
    /**
     * Fetch single item from the remote service via REST API and
     * replace internal dataset with the one comes from the remote service.
     *
     * @param id The item ID to fetch
     */
    fetch(id: string | number): Promise<AxiosResponse>;
    /**
     * Load data from the remote server or assign new data directly.
     * The internal dataset will be replaced by the loaded data.
     *
     * @param data The new data to replace the internal dataset
     */
    load(data?: unknown): Promise<TBsModel<T>[] | AxiosResponse>;
    /**
     * Load data from the remote server and assign query parameters and configuration.
     *
     * @deprecated
     * Use `load` instead.
     */
    query(): Promise<TBsModel<T>[] | AxiosResponse>;
    /**
     * Sorts the internal dataset with the given criteria and returns the reference
     * of the internal dataset. This method depends on `remoteSort` property.
     *
     * @example
     * // sort by a single field
     * const results = await myStore.sort('myField', 'asc');
     *
     * // sorting by multiple fields
     * const results = await myStore.sort([
     *  {property: 'age', direction: 'desc'},
     *  {property: 'name', direction: 'asc'}
     * ]);
     *
     * @param options   The field name to sort or sort method criteria.
     * @param direction The sort direction.
     */
    sort(options: string | string[] | SortOption | SortOption[], direction?: SortDirection): Promise<TBsModel<T>[]>;
}
/**
 * Data Store class to work with collection of entity objects and remote API.
 *
 * @example
 * const dsStore = new BsStore({
 *     idProperty: 'id',
 *     dataProperty: 'data',
 *     totalProperty: 'total',
 *     pageSize: 15,
 *     restProxy: {
 *         browse: '/api/users',
 *         delete: {url: './api/users', method: 'delete'},
 *         save: {url: './api/users', method: 'post'},
 *         update: {url: './api/users', method: 'patch'}
 *     },
 *     csrfConfig: {
 *         url: '/api/token/{name}',
 *         tokenName: 'token_name',
 *         dataField: 'value',
 *         suffix: false,
 *     },
 * });
 *
 * @author Ahmad Fajar
 * @since  20/07/2018 modified: 30/04/2026 17:17
 */
declare class BsStore<T extends TRecord = TRecord> extends AbstractStore<T> implements IBsStore<T> {
    /**
     * Construct new {@link BsStore} object instance.
     *
     * @param config  The configuration properties
     * @param adapter Axios adapter instance
     *
     * @example
     * const dsStore = new BsStore({
     *     idProperty: 'id',
     *     dataProperty: 'data',
     *     totalProperty: 'total',
     *     pageSize: 15,
     *     restProxy: {
     *         browse: '/api/users',
     *         delete: {url: './api/users', method: 'delete'},
     *         save: {url: './api/users', method: 'post'},
     *         update: {url: './api/users', method: 'patch'}
     *     },
     *     csrfConfig: {
     *         url: '/api/token/{name}',
     *         tokenName: 'token_name',
     *         dataField: 'value',
     *         suffix: false,
     *     },
     * });
     */
    constructor(config: DataStoreConfig, adapter?: AxiosInstance | null);
    get dataItems(): TBsModel<T>[];
    get remoteFilter(): boolean;
    set remoteFilter(value: boolean);
    get remotePaging(): boolean;
    set remotePaging(value: boolean);
    get remoteSort(): boolean;
    set remoteSort(value: boolean);
    aggregateAvg(field: string): number;
    aggregateCountBy(field: string, value: unknown): number;
    aggregateSum(field: string): number;
    /**
     * Append an item to the internal dataset and also save the item as a new record to the
     * remote server whenever possible. The item can be saved to the remote server,
     * if `restUrl` property contains a `save` key.
     *
     * @param item Data to append to the internal dataset
     * @see {@link restUrl} property
     */
    append(item: TRecord): void;
    assignData(data: unknown, silent?: boolean): void;
    /**
     * Delete specific item from internal dataset as well as from remote service whenever possible.
     * The item can be deleted from the remote service, if `restUrl` property contains a `delete` key.
     *
     * @param item Data Model instance to be removed
     * @see {@link restUrl} property
     */
    delete<P extends TBsModel<T>>(item: P): Promise<AxiosResponse | MessageResponse>;
    /**
     * Delete specific items from internal dataset as well as from remote
     * service whenever possible. The items can be deleted from the remote
     * service, if `restUrl` property contains a `delete` key.
     *
     * @param items Collection of data Model instances to be removed
     * @see {@link restUrl} property
     */
    deletes<P extends TBsModel<T>>(items: P[]): Promise<MessageResponse>;
    fetch(id: string | number): Promise<AxiosResponse>;
    load(data?: unknown): Promise<TBsModel<T>[] | AxiosResponse>;
    query(): Promise<TBsModel<T>[] | AxiosResponse>;
    sort(options: string | string[] | SortOption | SortOption[], direction?: SortDirection): Promise<TBsModel<T>[]>;
    /**
     * Assign values from REST response's object.
     *
     * @param response Response object
     */
    private _assignFromResponse;
}

declare interface IHttpService {
    /**
     * Send HTTP GET to the remote server.
     *
     * @param url     API url
     * @param data    The data to be sent
     * @param options Additional options
     * @returns Promise instance
     */
    get(url: string, data?: TRecord, options?: RawAxiosRequestConfig): AxiosPromise;
    /**
     * Send HTTP PATCH to the remote server.
     *
     * @param url     API url
     * @param data    The data to be sent
     * @param options Additional options
     * @returns Promise instance
     */
    patch(url: string, data: TRecord | FormData, options?: RawAxiosRequestConfig): AxiosPromise;
    /**
     * Send HTTP POST to the remote server.
     *
     * @param url     API url
     * @param data    The data to be sent
     * @param options Additional options
     * @returns Promise instance
     */
    post(url: string, data: TRecord | FormData, options?: RawAxiosRequestConfig): AxiosPromise;
    /**
     * Send HTTP PUT to the remote server.
     *
     * @param url     API url
     * @param data    The data to be sent
     * @param options Additional options
     * @returns Promise instance
     */
    put(url: string, data: TRecord | FormData, options?: RawAxiosRequestConfig): AxiosPromise;
    /**
     * Send HTTP DELETE to the remote server.
     *
     * @param url     API url
     * @param data    The data to be sent
     * @param options Additional options
     * @returns Promise instance
     */
    delete(url: string, data?: TRecord, options?: RawAxiosRequestConfig): AxiosPromise;
}
declare const AxiosPlugin: ObjectPlugin;

/**
 * Generate component's ID.
 *
 * @returns The generated ID
 */
declare function useGenerateId(): string;
/**
 * Check whether it is using a mobile browser or not.
 *
 * @returns `true` if mobile browser is used otherwise `false`.
 */
declare function useMobileDevice(): boolean;
/**
 * Simple function to render a VNode with custom slot.
 * If the custom slot doesn't exist or `undefined`
 * then the default `children` will be rendered.
 *
 * @param slots    The slot instance
 * @param name     The slot name
 * @param props    VNode property, include slot identifier
 * @param children The default VNode children to replace the slot
 * @param slotArgs The argument for the given slot
 * @returns The rendered VNode.
 */
declare function useRenderSlot(slots: Slots, name: string, props?: Readonly<TRecord>, children?: VNodeArrayChildren | VNode, slotArgs?: TRecord): VNode;
/**
 * Simple function to render a VNode with custom slot and wrap it with the given
 * `wrapperTag` and properties. If the custom slot doesn't exist or `undefined` then
 * the default `children` will be rendered inside the `wrapperTag`.
 *
 * @param slots        The slot instance
 * @param name         The slot name
 * @param key          Fragment key identifier
 * @param wrapperProps The VNode wrapper properties
 * @param children     The default VNode children to replace the slot
 * @param wrapperTag   Valid HTML tag name, default is `div`
 * @param slotArgs     The argument for the given slot
 * @returns The rendered VNode.
 */
declare function useWrapSlot(slots: Slots, name: string, key: string, wrapperProps?: Readonly<TRecord>, children?: VNodeArrayChildren | VNode, wrapperTag?: string, slotArgs?: TRecord): VNode;
/**
 * Simple function to render an HTML tag as VNode or render default slot and wrap
 * an HTML tag around it.
 *
 * @param tag      Valid HTML tag name
 * @param slots    The slot instance
 * @param classes  Custom CSS classes to apply
 * @param styles   Custom inline stylesheet to apply
 * @returns The rendered VNode.
 */
declare function useWrapSlotDefault(tag: string, slots?: Slots, classes?: TClassList, styles?: TRecord): VNode;
/**
 * Simple function to render a VNode with custom slot and wrap it with the given
 * `wrapTag` and properties. The VNode will be rendered if the given `condition` is matched.
 *
 * @param slots      The slot instance
 * @param name       The slot name
 * @param condition  The given condition
 * @param wrapProps  The VNode wrapper properties
 * @param wrapTag    Valid HTML tag name, default is `div`
 * @param slotArgs   The argument for the given slot
 * @returns The rendered VNode.
 */
declare function useWrapSlotWithCondition(slots: Slots, name: string, condition: boolean, wrapProps?: Readonly<TRecord>, wrapTag?: string, slotArgs?: TRecord): VNode | undefined;
/**
 * Simple function to render a Transition VNode.
 *
 * @param props    The transition properties
 * @param children The child nodes
 * @param asBlock  Render the Transition as block VNode.
 * @returns The rendered VNode.
 */
declare function useRenderTransition(props: Readonly<TransitionProps> | undefined, children: VNodeArrayChildren | VNode, asBlock?: boolean): VNode;
/**
 * Get current active route if exists.
 *
 * @returns The current route location.
 */
declare function useCurrentRoute(): Ref<RouteLocationNormalizedLoaded> | undefined;
/**
 * Simple function to detect whether a device's screen is within allowable
 * maximum screen resolution. Returns `true` when the screen resolution is within
 * allowable resolution otherwise `false`. Available breakpoints are:
 * `xs`, `sm`, `md`, `lg`, and `xl`.
 *
 * @param breakpoint Allowable maximum screen resolution.
 * @returns TRUE when the screen resolution is within allowable resolution.
 */
declare function useBreakpointMax(breakpoint: TBreakpoint | number): boolean;
/**
 * Simple function to detect whether a device's screen is within allowable
 * minimum screen resolution. Returns `true` when the screen resolution is within
 * allowable resolution otherwise `false`. Available breakpoints are:
 * `xs`, `sm`, `md`, `lg`, and `xl`.
 *
 * @param breakpoint Allowable minimum screen resolution.
 * @returns TRUE when the screen resolution is within allowable resolution.
 */
declare function useBreakpointMin(breakpoint: TBreakpoint | number): boolean;
/**
 * Merge one or more CSS classes and prevents duplicate.
 *
 * @param args The CSS classes to be merged.
 */
declare function useMergeClass(...args: unknown[]): string[];
/**
 * Retrieve axios plugin instance. Must be called within component and after
 * it instantiate. For example, called within `onMounted` event.
 *
 * @returns Axios instance when the component instance is resolved.
 */
declare function useAxiosPlugin(): AxiosInstance | undefined;
/**
 * Retrieve HTTP service plugin instance. Must be called within component and after
 * it instantiate. For example, called within `onMounted` event.
 *
 * @returns Axios instance when the component instance is resolved.
 */
declare function useHttpService(): IHttpService | undefined;
/**
 * Shortcut to retrieve the VueMdb plugin instance.
 *
 * @returns The VueMdb plugin instance.
 */
declare function useVueMdbService(): TVueMdb | undefined;
/**
 * Shortcut to retrieve NotificationProvider instance.
 *
 * @returns The notification provider instance.
 */
declare function useVueMdbNotification(): INotificationProvider | undefined;

/**
 * Register event 'resizeListener' and utilize the ResizeObserver to monitor the event.
 *
 * @param target The target element.
 * @param fn     The callback function.
 */
declare function useAddResizeListener(target: IBindingElement, fn: CallableFunction): void;
/**
 * Un-register event 'resizeListener' and disconnect it from ResizeObserver.
 *
 * @param target The target element.
 * @param fn     The callback function.
 */
declare function useRemoveResizeListener(target: IBindingElement, fn?: CallableFunction): void;

declare type TFontAwesomeVariant = 'regular' | 'solid' | 'brands' | string;
declare type TIconFlip = 'horizontal' | 'vertical' | 'both';
declare type TIconRotation = '90' | '180' | '270';
declare type TIconData = {
    name: string;
    icon: string;
    theme: string;
    variant?: string;
    data?: string;
};
declare type TSizeProps = {
    /**
     * This component's height.
     */
    height?: Numberish;
    /**
     * This component's width.
     */
    width?: Numberish;
};
declare type TSizeOptionProps = TSizeProps & {
    /**
     * Shortcut to create this component with equal height and width.
     */
    size?: Numberish | TSizeProps;
};
declare type TIconBaseProps = {
    /**
     * Android icon name with or without suffix. Valid suffixes are: `_outlined` ,
     * `_rounded`, `_sharp`, `_filled`, `_outlined_filled`, `_rounded_filled`,
     * or `_sharp_filled`. If no suffix is given, then default (`outlined`) icon
     * variant will be used.
     *
     * Suffix `_filled` and `_outlined_filled` will result the same icon style variant.
     * And you can either use `*_filled` or sets property `filled` to `true` to
     * create an icon with fill style.
     *
     * @see [Google Material Symbol](https://fonts.google.com/icons?icon.set=Material+Symbols) for details.
     */
    icon: string;
    /**
     * Use [Google Material Symbol](https://fonts.google.com/icons?icon.set=Material+Symbols) with fill style.
     */
    filled?: boolean;
    /**
     * Apply **pulse** animation to the icon.
     */
    pulse?: boolean;
    /**
     * Apply **spin** animation to the icon.
     */
    spin?: boolean;
    /**
     * Flip the icon, valid values are: `horizontal`, `vertical`, `both`.
     */
    flip?: TIconFlip;
    /**
     * Rotate the icon, valid values are: `90`, `180`, `270`.
     */
    rotate?: TIconRotation;
};
declare type TIconOptionProps = TSizeOptionProps & TIconBaseProps & {
    /**
     * Apply additional CSS class to the SVG.
     */
    svgClass?: TClassList;
};
declare type TSvgIconOptionProps = TSizeOptionProps & TIconBaseProps;
declare type TFontawesomeIconOptionProps = TSizeOptionProps & {
    /**
     * Any valid font awesome icon name.
     *
     * @see [Font Awesome](https://fontawesome.com/search?ic=free-collection) for details.
     */
    icon: string;
    /**
     * Font Awesome style variant, valid values are: `regular`, `solid`, `brands`.
     * Default is `solid`.
     */
    variant?: TFontAwesomeVariant;
    /**
     * Font Awesome vendor version. Default is `7.2.0`.
     */
    version?: string;
    /**
     * Apply **pulse** animation to the icon.
     */
    pulse?: boolean;
    /**
     * Apply **spin** animation to the icon.
     */
    spin?: boolean;
    /**
     * Flip the icon, valid values are: `horizontal`, `vertical`, `both`.
     */
    flip?: TIconFlip;
    /**
     * Rotate the icon, valid values are: `90`, `180`, `270`.
     */
    rotate?: TIconRotation;
    /**
     * Apply additional CSS class to the SVG.
     */
    svgClass?: TClassList;
};
declare type TSpinnerIconOptionProps = {
    /**
     * Sets the Icon color.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `default`.
     */
    color?: TContextColor | string;
    /**
     * Sets the icon’s size in pixel.
     */
    size?: Numberish;
    /**
     * Apply **pulse** animation to the icon.
     */
    pulse?: boolean;
    /**
     * Apply **spin** animation to the icon.
     */
    spin?: boolean;
};
declare type TToggleIconOptionProps = {
    /**
     * The icon to display when `modelValue` property is `false` or `undefined`.
     *
     * Use android icon name with or without suffix. Valid suffixes are: `_outlined`,
     * `_rounded`, `_sharp`, `_filled`, `_outlined_filled`, `_rounded_filled`, or
     * `_sharp_filled`. If no suffix is given, then default (`outlined`) icon
     * variant will be used.
     *
     * Suffix `_filled` or `_outlined_filled` will result the same icon style variant.
     * And you can either use `*_filled` or sets the `filled` property to `true` to
     * create an icon with fill style.
     *
     * @see  [Google Material Symbol](https://fonts.google.com/icons?icon.set=Material+Symbols) for details.
     */
    icon: string;
    /**
     * The icon to display when `modelValue` property is `true`.
     *
     * Use android icon name with or without suffix. Valid suffixes are: `_outlined`,
     * `_rounded`, `_sharp`, `_filled`, `_outlined_filled`, `_rounded_filled`, or
     * `_sharp_filled`. If no suffix is given, then default (`outlined`) icon
     * variant will be used.
     *
     * Suffix `_filled` or `_outlined_filled` will result the same icon style variant.
     * And you can either use `*_filled` or sets the `filled` property to `true` to
     * create an icon with fill style.
     *
     * @see  [Google Material Symbol](https://fonts.google.com/icons?icon.set=Material+Symbols) for details.
     */
    toggleIcon: string;
    /**
     * Use [Google Material Symbol](https://fonts.google.com/icons?icon.set=Material+Symbols) with fill style.
     */
    filled?: boolean;
    /**
     * Value monitored by `v-model` to maintain this component state.
     */
    modelValue?: boolean;
    /**
     * The icon size in pixels.
     */
    size?: Numberish;
};
declare type TBsIcon = ComponentObjectPropsOptions<TIconOptionProps>;
declare type TBsSvgIcon = ComponentObjectPropsOptions<TSvgIconOptionProps>;
declare type TBsSpinnerIcon = ComponentObjectPropsOptions<TSpinnerIconOptionProps>;
declare type TBsFontawesomeIcon = ComponentObjectPropsOptions<TFontawesomeIconOptionProps>;
declare type TBsToggleIcon = ComponentObjectPropsOptions<TToggleIconOptionProps>;

declare const spinnerSvgData = "M304 48c0 26.51-21.49 48-48 48s-48-21.49-48-48 21.49-48 48-48 48 21.49 48 48zm-48 368c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.49-48-48-48zm208-208c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.49-48-48-48zM96 256c0-26.51-21.49-48-48-48S0 229.49 0 256s21.49 48 48 48 48-21.49 48-48zm12.922 99.078c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48c0-26.509-21.491-48-48-48zm294.156 0c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48c0-26.509-21.49-48-48-48zM108.922 60.922c-26.51 0-48 21.49-48 48s21.49 48 48 48 48-21.49 48-48-21.491-48-48-48z";
/**
 * Function to draw inline SVG XML directly.
 *
 * @param data   The SVG XML string
 * @param width  The desired {@link Element} width
 * @param height The desired {@link Element} height
 * @param clazz  Optional CSS class name
 */
declare function useRenderSVG(data: string, width: Numberish, height: Numberish, clazz: unknown): VNode;

declare class EventListener$1 {
    /**
     * Listen to DOM events during the bubble phase.
     *
     * @param target    DOM element to register listener on.
     * @param eventName Event type, e.g. 'click' or 'mouseover'.
     * @param callback  Callback function.
     * @param options   Listener options.
     * @returns Object with a `remove` method.
     */
    static listen(target: IHTMLElement, eventName: string, callback: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): IEventListenerResult | undefined;
}

declare type TPopoverPosition = 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'left-top' | 'left-bottom' | 'right' | 'right-top' | 'right-bottom';
declare type TPopupOptions = {
    /**
     * This Popover state: show or hide.
     */
    open?: boolean;
    /**
     * Close the Popover when ESC key is pressed.
     */
    escClose?: boolean;
    /**
     * Show backdrop overlay or not.
     */
    overlay?: boolean;
    /**
     * Close the Popover when the backdrop overlay is clicked.
     */
    overlayClickClose?: boolean;
    /**
     * The backdrop overlay color.
     * Must be a valid CSS color formatted string.
     */
    overlayColor?: string;
    /**
     * The backdrop overlay opacity.
     */
    overlayOpacity?: Numberish;
};
declare type TPopoverOptionProps = TPopupOptions & {
    /**
     * Display Popover at a position that covers the activator element.
     */
    cover?: boolean;
    /**
     * This Popover background color.
     *
     * @deprecated
     * Use unified global CSS variable instead.
     */
    color?: string;
    /**
     * Popover display placement.
     */
    placement?: TPopoverPosition;
    /**
     * Number of pixel to shift the Popover display position from the activator element.
     */
    space?: Numberish;
    /**
     * Transition animation when displaying the Popover. This animation is effected by `placement` property.
     */
    transition?: string;
    /**
     * HTML element or element ID which is used to activate and calculate this Popover display position.
     */
    trigger?: Element | string | null;
};
declare type TBsPopover = ComponentObjectPropsOptions<TPopoverOptionProps>;

declare type TPopupItem = {
    target: ComponentInternalInstance;
    props: Readonly<TPopupOptions>;
    active: Ref<boolean>;
};
declare const PopupManager: {
    items: TPopupItem[];
    locked: boolean;
    allowScrolling(): void;
    preventScrolling(): void;
    findItem(instance: ComponentInternalInstance): number;
    add(instance: ComponentInternalInstance, props: Readonly<TPopupOptions>, active: Ref<boolean>): void;
    remove(instance: ComponentInternalInstance): void;
    closePopover(instance: ComponentInternalInstance | null, isActive: Ref<boolean>, message: string): void;
};

declare type TCacheInternal = {
    value: unknown;
    expiry: number;
    hits: number;
};
declare type TRawCacheItem = {
    key: string;
    value: unknown;
    expiry: number;
};
declare interface ICacheItem {
    /**
     * Returns this cache item key.
     */
    getKey(): string;
    /**
     * Returns this cache item value.
     */
    getValue(): unknown;
    /**
     * Update this cache item value. If the value is changed,
     * it needs to be saved to the cache manager.
     *
     * @param value The value to store
     */
    setValue(value: unknown): void;
    /**
     * Returns this cache item hits counter.
     */
    getHits(): number;
    /**
     * Check whether this cache item is expired or not.
     */
    isExpired(): boolean;
    /**
     * Change this cache item expiry.
     *
     * @param value The timestamp since epoch
     */
    setExpiry(value: number): void;
    /**
     * Returns this cache item expiry timestamp.
     */
    expiredAt(): number;
}
declare class StorageProxy {
    private readonly _storage;
    constructor();
    private hasSessionStorage;
    clear(): void;
    getItem(key: string): TCacheInternal | undefined;
    setItem(key: string, value: TCacheInternal): void;
    removeItem(key: string): void;
    get size(): number;
}
declare interface ICacheManager {
    /**
     * Remove all items in the cache storage.
     */
    clear(): void;
    /**
     * Remove an item from the cache storage if exists.
     *
     * @param key The key to delete
     */
    deleteItem(key: string): void;
    /**
     * Remove multiple items from the cache storage.
     *
     * @param keys The keys to delete
     */
    deleteItems(keys: string[]): void;
    /**
     * Returns the cached item that represents the specified key.
     *
     * @param key The key to be used to return the corresponding cached item
     */
    getItem(key: string): ICacheItem | undefined;
    /**
     * Get multiple items from the cache storage and each of them is representing a cached item.
     *
     * @param keys An indexed array of keys to be used to return the corresponding cached items
     */
    getItems(keys: string[]): ICacheItem[];
    /**
     * Confirms if the cache storage contains the specified cached item.
     *
     * @param key The key for which to check its existence.
     */
    hasItem(key: string): boolean;
    /**
     * Persists an item to the cache storage immediately.
     *
     * @param item A data object to be cached
     */
    save(item: TRawCacheItem | ICacheItem): void;
    /**
     * Returns the number of items stored in the cache.
     */
    readonly size: number;
}
declare const CacheManager: {
    /**
     * Register cache internal storage.
     * @internal
     */
    _cacheStorage: StorageProxy;
    /**
     * Create cache item.
     * @internal
     */
    _createItem(key: string, value: unknown, expireAt?: Date | number, hits?: number): ICacheItem;
    /**
     * Remove all items in the cache storage.
     */
    clear(): void;
    /**
     * Remove an item from the cache storage if exists.
     *
     * @param key The key to delete
     */
    deleteItem(key: string): void;
    /**
     * Remove multiple items from the cache storage.
     *
     * @param keys The keys to delete
     */
    deleteItems(keys: string[]): void;
    /**
     * Returns the cached item that represents the specified key.
     *
     * @param key The key to be used to return the corresponding cached item
     */
    getItem(key: string): ICacheItem | undefined;
    /**
     * Get multiple items from the cache storage and each of them is representing a cached item.
     *
     * @param keys An indexed array of keys to be used to return the corresponding cached items
     */
    getItems(keys: string[]): ICacheItem[];
    /**
     * Confirms if the cache storage contains the specified cached item.
     *
     * @param key The key for which to check its existence.
     */
    hasItem(key: string): boolean;
    /**
     * Persists an item to the cache storage immediately.
     *
     * @param item A data object to be cached
     */
    save(item: TRawCacheItem | ICacheItem): void;
    /**
     * Returns the number of items stored in the cache.
     */
    readonly size: number;
};

/**
 * Hue, Saturation, Value and Alpha color values.
 */
declare type HSVA = {
    h: number;
    s: number;
    v: number;
    a: number;
};
/**
 * Hue, Saturation, Lightness and Alpha color values.
 */
declare type HSLA = {
    h: number;
    s: number;
    l: number;
    a: number;
};
/**
 * Lightness, Chroma, Hue and Alpha color values.
 */
declare type LCHA = {
    l: number;
    c: number;
    h: number;
    a: number;
};
/**
 * Red, Green, Blue and Alpha color values.
 */
declare type RGBA = {
    r: number;
    g: number;
    b: number;
    a: number;
};
/**
 * Convert HSL color space to HSV color space.
 *
 * @param color The HSLA color value.
 * @return The HSVA color value.
 */
declare function hslaToHsva(color: HSLA): HSVA;
/**
 * Convert HSL color space to RGB color space.
 *
 * @param color The HSLA color value.
 * @return The RGBA color value. `Red`, `Green`, and `Blue` as number in range [0..255],
 * and `Alpha` as number in range [0..1].
 */
declare function hslaToRgba(color: HSLA): RGBA;
/**
 * Convert HSV color space to HSL color space.
 *
 * @param color The HSV color value.
 * @return The HSL color value. `Hue` as degrees [0..360], `Saturation` and `Lightness` as number in range [0..100].
 */
declare function hsvaToHsla(color: HSVA): HSLA;
/**
 * Convert HSV color space to RGB color space.
 *
 * @param color The HSVA color value.
 * @return The RGBA color value.
 * `Red`, `Green`, and `Blue` as number in range [0..255],
 * and `Alpha` as number in range [0..1].
 */
declare function hsvaToRgba(color: HSVA): RGBA;
/**
 * Convert CSS HEX color format to RGB color space.
 *
 * @param color The CSS HEX color value.
 * @return The RGBA color value.
 * `Red`, `Green`, and `Blue` as number in range [0..255],
 * and `Alpha` as number in range [0..1].
 */
declare function hexToRgba(color: string): RGBA;
/**
 * Convert RGB color space to HSL color space.
 *
 * @param color The RGBA color value
 * @return The HSL color value.
 * `Hue` as degrees [0..360], `Saturation` and `Lightness` as range [0..100].
 */
declare function rgbaToHsla(color: RGBA): HSLA;
/**
 * Convert RGB color space to HSV color space.
 *
 * @param color The RGBA color value.
 * @return The HSVA color value.
 */
declare function rgbaToHsva(color: RGBA): HSVA;
/**
 * Convert OKLCH color space to RGB color space.
 *
 * @param color The OKLCH color value.
 * @return The RGBA color value.
 * `Red`, `Green`, and `Blue` as number in range [0..255],
 * and `Alpha` as number in range [0..1].
 */
declare function oklchToRgba(color: LCHA): RGBA;
/**
 * Convert RGB color space to OKLCH color space.
 *
 * @param color The RGBA color value.
 * @return The OKLCH color value.
 * `Lightness` and `Chroma` as number in range [0..1], `Hue` as degrees [0..360].
 */
declare function rgbaToOklch(color: RGBA): LCHA;
/**
 * Parse a string to RGBA color value.
 *
 * @param canvasCtx  The canvas rendering context
 * @param source     String representing a color.
 * @return The RGBA color value.
 * `Red`, `Green`, and `Blue` as number in range [0..255],
 * and `Alpha` as number in range [0..1].
 */
declare function rgbaFromString(canvasCtx: CanvasRenderingContext2D, source: string): RGBA;
/**
 * Convert RGB/RGBA color to CSS HEX color format.
 *
 * @param color The RGBA value. `Red`, `Green`, `Blue` as number in range [0..255],
 *              and `Alpha` as number in range [0..1].
 * @return CSS Hex color.
 */
declare function rgbaToHex(color: RGBA): string;
/**
 * Convert RGB/RGBA color to string.
 *
 * @param color The RGBA value. `Red`, `Green`, `Blue` as number in range [0..255],
 *              and `Alpha` as number in range [0..1].
 * @return CSS color string.
 */
declare function rgbaToString(color: RGBA): string;
/**
 * Convert HSL/HSLA color to string.
 *
 * @param color  The HSLA value. `Hue` as degrees [0..360], `Saturation`
 *               and `Lightness` as number in range [0..1].
 * @return CSS color string.
 */
declare function hslaToString(color: HSLA): string;
/**
 * Convert OKLCH color to string.
 *
 * @param color  The OKLCH value. `Lightness`, `Chroma` as number in range [0..1]
 *               and `Hue` as degrees [0..360].
 * @return CSS color string.
 */
declare function oklchToString(color: LCHA): string;
/**
 * Parse a string that represent `oklch` color formatted string.
 *
 * @param source The `oklch` color formatted string.
 * @return The OKLCH color value
 * `Lightness`, `Chroma` as number in range [0..1] and `Hue` as degrees [0..360].
 */
declare function oklchFromString(source: string): LCHA;
/**
 * Get Lightness level from `RGBA`, `HSLA` or `OKLCH` color object.
 *
 * @param color The `RGBA`, `HSLA` or `OKLCH` color value.
 * @return The Lightness level in range [1..100].
 */
declare function lightnessLevel(color: RGBA | HSLA | LCHA): number;
/**
 * Get brightness level from RGBA color.
 *
 * @param color The RGBA color value or HEX color formatted string.
 * @return The brightness level in range [1..255].
 */
declare function brightnessLevel(color: string | RGBA): number;
/**
 * Darken or lighten the input color.
 *
 * Use negative `lightness` value to darken the input color or otherwise
 * to lighten the input color.
 *
 * @param color      The color to darken/lighten.
 * @param lightness  The lightness level.
 * @return The color result in CSS HEX color format.
 */
declare function shadeColor(color: string | RGBA, lightness: number): string;

type ColorUtils_HSLA = HSLA;
type ColorUtils_HSVA = HSVA;
type ColorUtils_LCHA = LCHA;
type ColorUtils_RGBA = RGBA;
declare const ColorUtils_brightnessLevel: typeof brightnessLevel;
declare const ColorUtils_hexToRgba: typeof hexToRgba;
declare const ColorUtils_hslaToHsva: typeof hslaToHsva;
declare const ColorUtils_hslaToRgba: typeof hslaToRgba;
declare const ColorUtils_hslaToString: typeof hslaToString;
declare const ColorUtils_hsvaToHsla: typeof hsvaToHsla;
declare const ColorUtils_hsvaToRgba: typeof hsvaToRgba;
declare const ColorUtils_lightnessLevel: typeof lightnessLevel;
declare const ColorUtils_oklchFromString: typeof oklchFromString;
declare const ColorUtils_oklchToRgba: typeof oklchToRgba;
declare const ColorUtils_oklchToString: typeof oklchToString;
declare const ColorUtils_rgbaFromString: typeof rgbaFromString;
declare const ColorUtils_rgbaToHex: typeof rgbaToHex;
declare const ColorUtils_rgbaToHsla: typeof rgbaToHsla;
declare const ColorUtils_rgbaToHsva: typeof rgbaToHsva;
declare const ColorUtils_rgbaToOklch: typeof rgbaToOklch;
declare const ColorUtils_rgbaToString: typeof rgbaToString;
declare const ColorUtils_shadeColor: typeof shadeColor;
declare namespace ColorUtils {
  export { ColorUtils_brightnessLevel as brightnessLevel, ColorUtils_hexToRgba as hexToRgba, ColorUtils_hslaToHsva as hslaToHsva, ColorUtils_hslaToRgba as hslaToRgba, ColorUtils_hslaToString as hslaToString, ColorUtils_hsvaToHsla as hsvaToHsla, ColorUtils_hsvaToRgba as hsvaToRgba, ColorUtils_lightnessLevel as lightnessLevel, ColorUtils_oklchFromString as oklchFromString, ColorUtils_oklchToRgba as oklchToRgba, ColorUtils_oklchToString as oklchToString, ColorUtils_rgbaFromString as rgbaFromString, ColorUtils_rgbaToHex as rgbaToHex, ColorUtils_rgbaToHsla as rgbaToHsla, ColorUtils_rgbaToHsva as rgbaToHsva, ColorUtils_rgbaToOklch as rgbaToOklch, ColorUtils_rgbaToString as rgbaToString, ColorUtils_shadeColor as shadeColor };
  export type { ColorUtils_HSLA as HSLA, ColorUtils_HSVA as HSVA, ColorUtils_LCHA as LCHA, ColorUtils_RGBA as RGBA };
}

/**
 * Class Helper with static functions.
 *
 * @author Ahmad Fajar
 * @since  05/07/2018, modified: 21/09/2025 18:30
 */
declare class Helper {
    /**
     * Creates range of number.
     *
     * @param length Range length
     * @returns Array of numbers
     */
    static createRange(length: number): number[];
    /**
     * Defer or delay execution of a function.
     *
     * @param callback   The function to execute
     * @param delay      Number of delay in ms
     * @param args       Optional arguments which are passed through the `callback`
     * @returns {number} The returned **timeoutID** is a positive integer value
     * which identifies the timer created by the call to **setTimeout()**.
     * This value can be passed to [clearTimeout]{@link https://developer.mozilla.org/en-US/docs/Web/API/clearTimeout}
     * to cancel the timeout.
     */
    static defer(callback: CallableFunction, delay: number, ...args: unknown[]): number;
    /**
     * Get a value from an Object property.
     *
     * @param obj         The object to check
     * @param path        Array of field name
     * @param fallbackFn  The fallback function
     * @returns The object property value
     */
    static getNestedValue(obj: unknown, path: string[], fallbackFn?: CallableFunction): CallableFunction | never | unknown;
    /**
     * Get a value from an Object property.
     *
     * @param obj        The object to evaluate
     * @param path       The property name
     * @param fallbackFn The fallback function
     * @returns The object property value
     */
    static getObjectValueByPath(obj: unknown, path: string, fallbackFn?: CallableFunction): unknown;
    /**
     * Check a value is empty or not.
     *
     * @param value             The value to check
     * @param allowEmptyString  Allow empty string or not
     * @returns TRUE if value is empty otherwise False
     */
    static isEmpty(value: unknown, allowEmptyString?: boolean): value is null | undefined | [] | '';
    /**
     * Check a value is an empty object or not.
     *
     * @param value The value to check
     * @returns TRUE if value is empty otherwise False
     */
    static isEmptyObject(value: unknown): value is null | undefined;
    /**
     * Check the type of value is Array or not. NULL value is considered as not an Array.
     *
     * @param value The value to check
     * @returns TRUE if the given value is an Array otherwise FALSE
     */
    static isArray(value: unknown): value is unknown[];
    /**
     * Check the type of value is Function or not. NULL or UNDEFINED is considered as not a Function.
     *
     * @param value The value to check
     * @returns TRUE if the given value is a Function otherwise FALSE
     */
    static isFunction(value: unknown): value is CallableFunction;
    /**
     * Check the type of value, whether it is a number or not.
     *
     * @param value The value to check
     * @returns TRUE if the given value is a Number otherwise FALSE
     */
    static isNumber(value: unknown): value is number;
    /**
     * Check the type of value is Object or not. NULL value is considered as not an object.
     *
     * @param value The value to check
     * @returns TRUE if the given value is an object otherwise FALSE
     */
    static isObject(value: unknown): value is object;
    /**
     * Check the type of value, whether it is primitive type or not.
     *
     * @param value The value to check
     * @returns TRUE if the data type is primitive otherwise False
     */
    static isPrimitive(value: unknown): value is string | number | boolean | symbol;
    /**
     * Check the type of value, whether it is a string or not.
     *
     * @param value The value to check
     * @returns TRUE if the given value is a String otherwise FALSE
     */
    static isString(value: unknown): value is string;
    /**
     * Round floating point value to the nearest decimal.
     *
     * @param value         The floating point value to be rounded
     * @param fractionDigit Maximum fraction/decimal digit
     * @returns The rounded value
     */
    static roundNumber(value: number, fractionDigit: number): number;
    static parseFloatLoose(value: string): number | undefined;
    static parseIntLoose(value: string): number | undefined;
    /**
     * Convert Number or String to any valid CSS unit size.
     *
     * @param value The value to convert
     * @param unit  The dimension to add
     * @returns CSS inline dimension
     */
    static cssUnit(value: string | number | undefined | null, unit?: string | null): string | undefined;
    /**
     * Sort an array of object.
     *
     * @param items        Array of object
     * @param key          Field name or key to sort
     * @param isDescending Sort desc or asc
     * @returns The sorted array
     */
    static sortArrayObj(items: Array<object>, key: string, isDescending?: boolean): object[];
    /**
     * Generate simple/random UID or standard UUID v4.
     *
     * @param standard If `true` then generate standard UUID v4 otherwise generate random UID
     * @returns UUID v4 or random UID
     */
    static uuid(standard?: boolean): string;
}

/**
 * Pads the input string with a given string (possibly repeated) so that the resulting string
 * reaches a given length. The padding is applied from the start (left) of the input string.
 *
 * @param str        The string to Pad.
 * @param maxLength  The length of the resulting string once the current string has
 *                   been padded. If this parameter is smaller than the current
 *                   string's length, the current string will be returned as it is.
 * @param fillString The string to pad the current string with.
 *                   If this string is too long, it will be truncated and the left-most
 *                   part will be applied. The default value for this parameter is " " (U+0020).
 * @returns New String that has been padded on the left side.
 */
declare function padLeft(str: string | number, maxLength?: number, fillString?: string): string;
/**
 * Pads the input string with a given string (possibly repeated) so that the resulting string
 * reaches a given length. The padding is applied from the end (right) of the input string.
 *
 * @param str        The string to Pad.
 * @param maxLength  The length of the resulting string once the current string has
 *                   been padded. If this parameter is smaller than the current
 *                   string's length, the current string will be returned as it is.
 * @param fillString The string to pad the current string with.
 *                   If this string is too long, it will be truncated and the left-most
 *                   part will be applied. The default value for this parameter is " " (U+0020).
 * @returns New String that has been padded on the right side.
 */
declare function padRight(str: string | number, maxLength?: number, fillString?: string): string;
/**
 * Simple function to transform the input string into "Title Case".
 *
 * @param text The input string to transform.
 * @returns New string that has been transform to "Title Case".
 */
declare function titleCase(text?: string): string;
/**
 * Create an array of chunked strings.
 *
 * @param source The input string.
 * @param size   The number of characters within a chunk.
 * @returns Array of chunked strings.
 */
declare function chunk(source: string, size?: number): string[];
/**
 * Replace special characters from the given `source` with encoded chars.
 *
 * Double quote will always be encoded to HTML entity unless `excludeDblQuote` is set to `true`.
 *
 * @param source            The input string to encode.
 * @param excludeDblQuote   Optional, don't convert double quote to HTML entity.
 * @param chars             Optional, special characters to encode.
 * @param replaces          Optional, the encoded characters or replacement characters for the given `chars`.
 */
declare function encodeSpecialChars(source: string, excludeDblQuote?: boolean, chars?: string[], replaces?: string[]): string;
/**
 * Simple function to convert the input string into
 * [camel Case](https://en.wikipedia.org/wiki/Camel_case).
 *
 * @param text The input string to convert.
 * @returns New string that has been transform to "camelCase".
 */
declare function camelCase(text: string): string;
/**
 * Simple function to convert the input string into
 * [kebab-case](https://en.wikipedia.org/wiki/Letter_case#Use_within_programming_languages).
 *
 * @param text The input string to convert.
 * @returns New string that has been transform to "kebab-case".
 */
declare function kebabCase(text: string): string;
/**
 * Determines whether an input string starts with any of the specified string,
 * returning true or false as appropriate. The test is performed in
 * case-sensitive manner.
 *
 * @param source   The input string.
 * @param searches Collection of string to search at the start of input string.
 * @returns If any of the given string in the collection is found at the start of
 *          the input string then `true` is returned, otherwise `false`.
 */
declare function isStartWith(source?: string, searches?: string[]): boolean;
/**
 * Determines whether an input string ends with any of the specified string,
 * returning true or false as appropriate. The test is performed in
 * case-sensitive manner.
 *
 * @param source   The input string.
 * @param searches Collection of string to search at the end of input string.
 * @returns If any of the given string in the collection is found at the end of
 *          the input string then `true` is returned, otherwise `false`.
 */
declare function isEndWith(source?: string, searches?: string[]): boolean;
/**
 * Determines whether an input string contains any of the specified string,
 * returning true or false as appropriate. The test is performed in
 * case-sensitive manner.
 *
 * @param source   The input string.
 * @param searches Collection of string to be searched.
 * @returns If any of the given string in the collection is found at any position
 *          of the input string then `true` is returned, otherwise `false`.
 */
declare function isContains(source?: string, searches?: string[]): boolean;

declare const StringHelper_camelCase: typeof camelCase;
declare const StringHelper_chunk: typeof chunk;
declare const StringHelper_encodeSpecialChars: typeof encodeSpecialChars;
declare const StringHelper_isContains: typeof isContains;
declare const StringHelper_isEndWith: typeof isEndWith;
declare const StringHelper_isStartWith: typeof isStartWith;
declare const StringHelper_kebabCase: typeof kebabCase;
declare const StringHelper_padLeft: typeof padLeft;
declare const StringHelper_padRight: typeof padRight;
declare const StringHelper_titleCase: typeof titleCase;
declare namespace StringHelper {
  export {
    StringHelper_camelCase as camelCase,
    StringHelper_chunk as chunk,
    StringHelper_encodeSpecialChars as encodeSpecialChars,
    StringHelper_isContains as isContains,
    StringHelper_isEndWith as isEndWith,
    StringHelper_isStartWith as isStartWith,
    StringHelper_kebabCase as kebabCase,
    StringHelper_padLeft as padLeft,
    StringHelper_padRight as padRight,
    StringHelper_titleCase as titleCase,
  };
}

declare type ClosableEventProps = {
    /**
     * Fired when this component is closed or dismissed (hide).
     */
    close?: (msg: string) => void;
};
declare interface ClosableEventPublic {
    /**
     * Fired when this component is closed or dismissed (hide).
     */
    onClose?: (msg: string) => void;
    /**
     * Fired when this component is closed or dismissed (hide).
     */
    '@close'?: (msg: string) => void;
}
declare type ClosableVoidEventProps = {
    /**
     * Fired when this component is closed or dismissed (hide).
     */
    close?: VoidFunction;
};
declare interface ClosableVoidEventPublic {
    /**
     * Fired when this component is closed or dismissed (hide).
     */
    onClose?: VoidFunction;
    /**
     * Fired when this component is closed or dismissed (hide).
     */
    '@close'?: VoidFunction;
}
declare type UpdateOpenEventProps = {
    /**
     * Fired when the component's state is updated.
     */
    'update:open'?: (state: boolean) => void;
};
declare interface UpdateOpenEventPublic {
    /**
     * Fired when the component's state is updated.
     */
    'onUpdate:open'?: (state: boolean) => void;
    /**
     * Fired when the component's state is updated.
     */
    '@update:open'?: (state: boolean) => void;
}
declare type UpdateModelValueEventProps<T> = {
    /**
     * Fired when this component's `modelValue` is updated.
     */
    'update:model-value'?: (value: T) => void;
};
declare interface UpdateModelValueEventPublic<T> {
    /**
     * Fired when this component's `modelValue` is updated.
     */
    'onUpdate:modelValue'?: (value: T) => void;
    /**
     * Fired when this component's `modelValue` is updated.
     */
    '@update:model-value'?: (value: T) => void;
}
declare interface VoidDefaultSlots {
    /**
     * The default slot used to place main content of the Component.
     */
    default?: () => VNode[] | VNode;
}

declare const _default$17: DefineComponent<{}, () => VNode, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}>, {}, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type TRippleOptionProps = {
    /**
     * Ripple animation state.
     */
    active?: boolean | Event;
    /**
     * Start animation from center or from mouse click position.
     * If true then animation always start from center, otherwise animation
     * will start from mouse click position.
     */
    centered?: boolean;
    /**
     * Enable or disable ripple animation.
     */
    disabled?: boolean;
    /**
     * HTML tag used to render this component, default is `div`.
     */
    tag?: HtmlTagName | string;
};
declare type TOverlayOptionProps = {
    /**
     * Overlay base color. Must be a valid CSS color formatted string.
     */
    color?: string;
    /**
     * Sets the css-style `position` value. If `true` then css-style `position` is set to `fixed`.
     */
    fixed?: boolean;
    /**
     * Overlay state, show or hide.
     */
    show?: boolean;
    /**
     * Overlay opacity.
     */
    opacity?: Numberish;
    /**
     * Overlay inline-css `z-index`.
     */
    zIndex?: Numberish;
};
declare type TBsOverlay = ComponentObjectPropsOptions<TOverlayOptionProps>;
declare type TBsRipple = ComponentObjectPropsOptions<TRippleOptionProps>;

declare const _default$16: DefineComponent<TBsOverlay, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, OverlayEventProps, string, PublicProps, Readonly<TOverlayOptionProps> & Readonly<OverlayEventPublic>, ExtractDefaultPropTypes<TBsOverlay>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type OverlayEventProps = {
    /**
     * Fired when the Overlay component is clicked.
     */
    click?: (event: Event) => void;
};
declare interface OverlayEventPublic {
    /**
     * Fired when the Overlay component is clicked.
     */
    onClick?: (event: Event) => void;
    /**
     * Fired when the Overlay component is clicked.
     */
    '@click'?: (event: Event) => void;
}

declare const _default$15: DefineComponent<TBsRipple, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, RippleEventProps, string, PublicProps, Readonly<TRippleOptionProps> & Readonly<RippleEventPublic>, ExtractDefaultPropTypes<TBsRipple>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type RippleEventProps = {
    /**
     * Fired when the ripple effect is updated.
     */
    'update:active'?: (value: boolean) => void;
};
declare interface RippleEventPublic {
    /**
     * Fired when the ripple effect is updated.
     */
    'onUpdate:active'?: (value: boolean) => void;
    /**
     * Fired when the ripple effect is updated.
     */
    '@update:active'?: (value: boolean) => void;
}

declare const BsAnimationPlugin: ObjectPlugin;

declare const _default$14: DefineComponent<TBsFontawesomeIcon, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TFontawesomeIconOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsFontawesomeIcon>, {}, {}, {}, string, ComponentProvideOptions, false, never>;

declare const _default$13: DefineComponent<TBsIcon, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TIconOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsIcon>, {}, {}, {}, string, ComponentProvideOptions, false, never>;

declare const _default$12: DefineComponent<TBsSpinnerIcon, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TSpinnerIconOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsSpinnerIcon>, {}, {}, {}, string, ComponentProvideOptions, false, never>;

declare const _default$11: DefineComponent<TBsSvgIcon, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TSvgIconOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsSvgIcon>, {}, {}, {}, string, ComponentProvideOptions, false, never>;

declare const _default$10: DefineComponent<TBsToggleIcon, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, UpdateModelValueEventProps<boolean>, string, PublicProps, Readonly<TToggleIconOptionProps> & Readonly<UpdateModelValueEventPublic<boolean>>, ExtractDefaultPropTypes<TBsToggleIcon>, {}, {}, {}, string, ComponentProvideOptions, false, never>;

declare const BsIconPlugin: ObjectPlugin;

declare type TDividerOptionProps = {
    /**
     * Set to `TRUE` when divider is placed inside element that has dark background color.
     */
    dark?: boolean;
    /**
     * Indentation from left side.
     */
    leftIndent?: Numberish;
    /**
     * Indentation from right side.
     */
    rightIndent?: Numberish;
    /**
     * Divider thickness.
     */
    thickness?: Numberish;
};
declare type TImageHolderOptionProps = TSizeOptionProps & {
    /**
     * Create this component with circle shape.
     */
    circle?: boolean;
    /**
     * Create this component with rounded shape.
     */
    rounded?: boolean;
    /**
     * This component's background color, must be in hex color format.
     */
    bgColor?: string;
    /**
     * This component's text color, must be in hex color format.
     */
    textColor?: string;
    /**
     * Short text as placeholder.
     */
    placeholderText?: string;
    /**
     * Text placeholder X position.
     */
    xPos?: Numberish;
    /**
     * Text placeholder Y position.
     */
    yPos?: Numberish;
};
declare type TSpacerOptionProps = {
    /**
     * Sets this component to fill the available space or not.
     */
    fill?: boolean;
    /**
     * Sets this component width.
     */
    width?: Numberish;
};
declare type TSubheaderOptionProps = {
    /**
     * Define explicitly when placed inside element that has dark background color.
     */
    dark?: boolean;
};
declare type TBsDivider = ComponentObjectPropsOptions<TDividerOptionProps>;
declare type TBsImageHolder = ComponentObjectPropsOptions<TImageHolderOptionProps>;
declare type TBsSpacer = ComponentObjectPropsOptions<TSpacerOptionProps>;
declare type TBsSubheader = ComponentObjectPropsOptions<TSubheaderOptionProps>;

declare const _default$$: DefineComponent<TBsDivider, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TDividerOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsDivider>, {}, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$_: DefineComponent<TBsImageHolder, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TImageHolderOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsImageHolder>, {}, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$Z: DefineComponent<TBsSpacer, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TSpacerOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsSpacer>, {}, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$Y: DefineComponent<TBsSubheader, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TSubheaderOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsSubheader>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const BsBasicCmpPlugin: ObjectPlugin;

declare type TAppContainerOptionProps = {
    /**
     * Sets the element `ID` attribute. This property value is auto generate.
     */
    id?: string;
    /**
     * Use document viewport height or not.
     */
    viewportHeight?: boolean;
};
declare type TContainerOptionProps = {
    /**
     * Mount this component as part of application container or just ordinary container.
     * If mount as part of application container, then it will adapt to `SideDrawer` and `Appbar` size.
     */
    app?: boolean;
    /**
     * Html tag used to render this component.
     */
    tag?: HtmlTagName | string;
};
declare type TBsAppContainer = ComponentObjectPropsOptions<TAppContainerOptionProps>;
declare type TBsContainer = ComponentObjectPropsOptions<TContainerOptionProps>;
declare type TBsContent = ComponentObjectPropsOptions<TContainerOptionProps>;

declare const _default$X: DefineComponent<TBsAppContainer, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TAppContainerOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsAppContainer>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$W: DefineComponent<TBsContainer, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ContainerEventProps, string, PublicProps, Readonly<TContainerOptionProps> & Readonly<ContainerEventPublic>, ExtractDefaultPropTypes<TBsContainer>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type ContainerEventProps = {
    /**
     * Fired when this component size is changed.
     */
    resize?: (target: HTMLElement) => void;
};
declare interface ContainerEventPublic {
    /**
     * Fired when this component size is changed.
     */
    onResize?: (target: HTMLElement) => void;
    /**
     * Fired when this component size is changed.
     */
    '@resize'?: (target: HTMLElement) => void;
}

declare const _default$V: DefineComponent<TBsContainer, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TContainerOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsContainer>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const BsContainerPlugin: ObjectPlugin;

declare type TAppbarOptionProps = {
    /**
     * Cut off the left side of the component.
     */
    clippedLeft?: boolean;
    /**
     * Cut off the right side of the component.
     */
    clippedRight?: boolean;
    /**
     * Placed `Appbar` fixed at the top of the page.
     * See [Bootstrap Position](https://getbootstrap.com/docs/5.3/helpers/position/) documentation.
     */
    fixedTop?: boolean;
    /**
     * Always stick `Appbar` at top of the page.
     * See [Bootstrap Position](https://getbootstrap.com/docs/5.3/helpers/position/) documentation.
     */
    stickyTop?: boolean;
    /**
     * Add shadow effect to this component.
     */
    shadow?: boolean;
    /**
     * Html tag used to render this component.
     */
    tag?: HtmlTagName | string;
};
declare type TAppbarTitleOptionProps = {
    /**
     * The text to display.
     */
    title?: string;
};
declare type TBsAppbar = ComponentObjectPropsOptions<TAppbarOptionProps>;
declare type TBsAppbarTitle = ComponentObjectPropsOptions<TAppbarTitleOptionProps>;

declare const _default$U: DefineComponent<TBsAppbar, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, AppbarEventProps, string, PublicProps, Readonly<TAppbarOptionProps> & Readonly<AppbarEventPublic>, ExtractDefaultPropTypes<TBsAppbar>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type AppbarEventProps = {
    /**
     * Fired when the Appbar is resized.
     */
    resize?: (target: HTMLElement) => void;
};
declare interface AppbarEventPublic {
    /**
     * Fired when the Appbar is resized.
     */
    onResize?: (target: HTMLElement) => void;
    /**
     * Fired when the Appbar is resized.
     */
    '@resize'?: (target: HTMLElement) => void;
}

declare const _default$T: DefineComponent<{}, () => VNode, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}>, {}, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$S: DefineComponent<TBsAppbarTitle, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TAppbarTitleOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsAppbarTitle>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const BsAppbarPlugin: ObjectPlugin;

declare const _default$R: DefineComponent<TBsSideDrawer, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, SideDrawerEventProps, string, PublicProps, Readonly<TSideDrawerOptionProps> & Readonly<SideDrawerEventPublic>, ExtractDefaultPropTypes<TBsSideDrawer>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type SideDrawerEventProps = UpdateOpenEventProps & {
    /**
     * Fired when this SideDrawer size is resized.
     */
    resize?: (target: HTMLElement) => void;
};
declare interface SideDrawerEventPublic extends UpdateOpenEventPublic {
    /**
     * Fired when this SideDrawer size is resized.
     */
    onResize?: (target: HTMLElement) => void;
    /**
     * Fired when this SideDrawer size is resized.
     */
    '@resize'?: (target: HTMLElement) => void;
}

declare const BsDrawerPlugin: ObjectPlugin;

declare type TCardContentType = 'title' | 'subtitle' | 'text';
declare type TTagProp = {
    /**
     * Html tag used to render this component.
     */
    tag?: HtmlTagName | string;
};
declare type TCardOptionProps = TTagProp & {
    /**
     * Set to `true` to remove the side border of the Card component.
     */
    borderOff?: boolean;
    /**
     * Set to `true` to remove the rounded border on the side of the Card component.
     */
    roundedOff?: boolean;
    /**
     * Apply shadow effect to the component.
     */
    shadow?: boolean;
    /**
     * The image URL for image placed at the top of the card.
     */
    imgTopSrc?: string;
    /**
     * Text for the image `alt` attribute.
     */
    imgTopAlt?: string;
    /**
     * The image URL for image placed at the bottom of the card.
     */
    imgBottomSrc?: string;
    /**
     * Text for the image `alt` attribute.
     */
    imgBottomAlt?: string;
};
declare type TCardContentOptionProps = TTagProp & {
    /**
     * Card content variations, valid values are: `title`, `subtitle`, `text`.
     */
    type?: TCardContentType;
};
declare type TCardMediaOptionProps = {
    /**
     * Text for media title.
     */
    title: string;
    /**
     * Text for media subtitle.
     */
    subtitle?: string;
    /**
     * Placed text overlay at the top side.
     */
    overlayTop?: boolean;
};
declare type TBsCard = ComponentObjectPropsOptions<TCardOptionProps>;
declare type TBsCardBody = ComponentObjectPropsOptions<TTagProp>;
declare type TBsCardContent = ComponentObjectPropsOptions<TCardContentOptionProps>;
declare type TBsCardFooter = ComponentObjectPropsOptions<TTagProp>;
declare type TBsCardHeader = ComponentObjectPropsOptions<TTagProp>;
declare type TBsCardMedia = ComponentObjectPropsOptions<TCardMediaOptionProps>;

declare const _default$Q: DefineComponent<TBsCard, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TCardOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsCard>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$P: DefineComponent<TBsCardBody, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TTagProp> & Readonly<{}>, ExtractDefaultPropTypes<TBsCardBody>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$O: DefineComponent<TBsCardContent, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TCardContentOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsCardContent>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$N: DefineComponent<TBsCardFooter, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TTagProp> & Readonly<{}>, ExtractDefaultPropTypes<TBsCardFooter>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$M: DefineComponent<TBsCardHeader, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TTagProp> & Readonly<{}>, ExtractDefaultPropTypes<TBsCardHeader>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$L: DefineComponent<TBsCardMedia, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TCardMediaOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsCardMedia>, SlotsType<CardMediaSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare interface CardMediaSlots extends VoidDefaultSlots {
    /**
     * The default slot used to place the CardMedia's title.
     */
    title?: () => VNode[] | VNode;
    /**
     * Additional slot used to place the CardMedia's subtitle.
     */
    subtitle?: () => VNode[] | VNode;
}

declare const BsCardPlugin: ObjectPlugin;

declare type TIconVariant = 'outlined' | 'rounded' | 'sharp' | 'filled' | 'outlined_filled' | 'rounded_filled' | 'sharp_filled';
declare type TAllowedImageProps = {
    /**
     * Create this component with circle shape.
     */
    circle?: boolean;
    /**
     * Create this component with rounded shape.
     */
    rounded?: boolean;
    /**
     * The image location to place inside this component.
     */
    imgSrc?: string;
    /**
     * Shortcut to create this component with equal height and width.
     */
    size?: Numberish | TSizeProps;
};
declare type TAllowedIconProps = {
    /**
     * A shortcut to insert component `BsIcon` inside this component.
     *
     * Use android icon name with or without suffix. Valid suffixes are:
     * `_outlined`, `_rounded`, `_sharp`, `_filled`, `_outlined_filled`,
     * `_rounded_filled`, or `_sharp_filled`. Suffix `_filled` and `_outlined_filled`
     * will result the same icon style variant. Suffix will take priority over
     * `icon-variant` property.
     *
     * @see [Google Material Symbol](https://fonts.google.com/icons?icon.set=Material+Symbols) for details.
     */
    icon?: string;
    /**
     * Use predefined icon style variant, valid values are: `outlined`, `rounded`,
     * `sharp`, `filled`, `outlined_filled`, `rounded_filled`, and `sharp_filled`.
     * Default is `outlined`.
     *
     * Variant `filled` and `outlined_filled` will result the same icon style variant.
     *
     * @see [Google Material Symbol](https://fonts.google.com/icons?icon.set=Material+Symbols) for details.
     */
    iconVariant?: TIconVariant;
    /**
     * Apply **spin** animation to the icon.
     */
    iconSpin?: boolean;
    /**
     * Apply **pulse** animation to the icon.
     */
    iconPulse?: boolean;
    /**
     * Flip the icon, valid values are: `horizontal`, `vertical`, `both`.
     */
    iconFlip?: TIconFlip;
    /**
     * Rotate the icon, valid values are: `90`, `180`, `270`.
     */
    iconRotation?: TIconRotation;
};
declare type TAvatarImageOptionProps = TSizeOptionProps & {
    /**
     * Create this component with circle shape.
     */
    circle?: boolean;
    /**
     * Create this component with rounded shape.
     */
    rounded?: boolean;
    /**
     * The image location to place inside this component.
     */
    imgSrc?: string;
    /**
     * Apply border width to this component.
     */
    border?: Numberish;
    /**
     * Apply border color to this component.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `default`.
     */
    borderColor?: TContextColor | string;
};
declare type TAvatarOptionProps = TAvatarImageOptionProps & TAllowedIconProps & {
    /**
     * Create avatar from a text. The text must be less than 4 characters.
     */
    text?: string;
};
declare type TBsAvatar = ComponentObjectPropsOptions<TAvatarOptionProps>;

declare const _default$K: DefineComponent<TBsAvatar, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TAvatarOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsAvatar>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const BsAvatarPlugin: ObjectPlugin;

declare type TFieldComponent = 'chip-field' | 'combobox-field' | 'datetime-field' | 'numeric-field' | 'search-field' | 'textarea-field' | 'text-field' | 'toggle-field';
declare type TFieldType = 'text' | 'email' | 'password' | 'tel' | 'url';
declare type TActionButtonPlacement = 'left' | 'right' | 'both';
declare type TActionButtonType = 'up-down' | 'plus-minus';
declare type TBoolRecord = Record<string, boolean>;
declare type TStringRecord = Record<string, string>;
declare type TValidator = {
    validators: TBoolRecord;
    messages: TStringRecord;
    hasError: boolean;
    dirty: boolean;
};
declare interface TComputedValidationResult {
    hasError: ComputedRef<boolean>;
    hasValidated: ComputedRef<boolean>;
    showValidationError: ComputedRef<boolean>;
    showHelpText: ComputedRef<boolean>;
    errorItems: ComputedRef<string[]>;
}
declare type TValidationProps = {
    /**
     * The help text to display below the field component.
     */
    helpText?: string;
    /**
     * Hide persistent help text, this property takes precedence over `persistentHelpText`.
     */
    persistentHelpOff?: boolean;
    /**
     * Show persistent help text or not.
     */
    persistentHelpText?: boolean;
    /**
     * The external validator plugin to be used to validate this field value.
     */
    validator?: TValidator;
};
declare type TInputBaseProps = {
    /**
     * Sets the `<input>` element `ID` attribute. This property value is auto generates.
     */
    id?: string;
    /**
     * Sets the `<input>` element `name` attribute.
     */
    name?: Numberish;
    /**
     * This input field state: enabled or disabled.
     */
    disabled?: boolean;
    /**
     * Sets this input field into readonly state.
     */
    readonly?: boolean;
    /**
     * Whether this input field is required or not.
     */
    required?: boolean;
};
declare type TInputFieldProps = TInputBaseProps & TValidationProps & {
    /**
     * Sets the action icon style variant.
     *
     * Valid predefined icon variants are: `outlined`, `rounded`, `sharp`,
     * `filled`, `outlined_filled`, `rounded_filled`, and `sharp_filled`.
     * Default is `outlined`.
     *
     * Variant `filled` and `outlined_filled` will result the same icon style variant.
     *
     * @see [Google Material Symbols](https://fonts.google.com/icons?icon.set=Material+Symbols) for details.
     */
    actionIconVariant?: TIconVariant;
    /**
     * Sets auto show the clear button.
     */
    clearButton?: boolean;
    /**
     * Create this component with **filled** appearance.
     *
     * @see [Google Material Design](https://m3.material.io/components/text-fields/overview) for details.
     */
    filled?: boolean;
    /**
     * Create this component with floating field label.
     *
     * @see [Google Material Design](https://m3.material.io/components/text-fields/overview) for details.
     */
    floatingLabel?: boolean;
    /**
     * Create this component with **outlined** appearance.
     *
     * @see [Google Material Design](https://m3.material.io/components/text-fields/overview) for details.
     */
    outlined?: boolean;
    /**
     * Display validation icon or not, when this field has been validated.
     */
    validationIcon?: boolean;
    /**
     * Sets icon to display on inner right side. This is a shortcut to insert
     * component `BsIcon` inside this component.
     *
     * Use android icon name with or without suffix. Valid suffixes are:
     * `_outlined`, `_rounded`, `_sharp`, `_filled`, `_outlined_filled`,
     * `_rounded_filled`, or `_sharp_filled`. If no suffix is given, then
     * default (`outlined`) icon variant will be used. Suffix `_filled`
     * and `_outlined_filled` will result the same icon style variant.
     *
     * @see [Google Material Symbols](https://fonts.google.com/icons?icon.set=Material+Symbols) for details.
     */
    appendIcon?: string;
    /**
     * Sets icon to display on outer right side. This is a shortcut to insert
     * component `BsIcon` inside this component.
     *
     * Use android icon name with or without suffix. Valid suffixes are:
     * `_outlined`, `_rounded`, `_sharp`, `_filled`, `_outlined_filled`,
     * `_rounded_filled`, or `_sharp_filled`. If no suffix is given, then
     * default (`outlined`) icon variant will be used. Suffix `_filled`
     * and `_outlined_filled` will result the same icon style variant.
     *
     * @see [Google Material Symbols](https://fonts.google.com/icons?icon.set=Material+Symbols) for details.
     */
    appendIconOuter?: string;
    /**
     * Sets icon to display on inner left side. This is a shortcut to insert
     * component `BsIcon` inside this component.
     *
     * Use android icon name with or without suffix. Valid suffixes are:
     * `_outlined`, `_rounded`, `_sharp`, `_filled`, `_outlined_filled`,
     * `_rounded_filled`, or `_sharp_filled`. If no suffix is given, then
     * default (`outlined`) icon variant will be used. Suffix `_filled`
     * and `_outlined_filled` will result the same icon style variant.
     *
     * @see [Google Material Symbols](https://fonts.google.com/icons?icon.set=Material+Symbols) for details.
     */
    prependIcon?: string;
    /**
     * Sets icon to display on outer left side. This is a shortcut to insert
     * component `BsIcon` inside this component.
     *
     * Use android icon name with or without suffix. Valid suffixes are:
     * `_outlined`, `_rounded`, `_sharp`, `_filled`, `_outlined_filled`,
     * `_rounded_filled`, or `_sharp_filled`. If no suffix is given, then
     * default (`outlined`) icon variant will be used. Suffix `_filled`
     * and `_outlined_filled` will result the same icon style variant.
     *
     * @see [Google Material Symbols](https://fonts.google.com/icons?icon.set=Material+Symbols) for details.
     */
    prependIconOuter?: string;
};
declare type TInputTextProps = TInputFieldProps & {
    /**
     * Sets browsers `autocomplete` predictions on/off.
     */
    autocomplete?: string | boolean;
    /**
     * Autofocus field when this component is mounted.
     */
    autofocus?: boolean;
    /**
     * Sets the field placeholder.
     */
    placeholder?: string;
};
declare type TTextFieldOptionProps = TInputTextProps & {
    /**
     * The value monitored by `v-model` to maintain this field value.
     */
    modelValue?: MaybeNumberish;
    /**
     * Sets <input> element type attribute. Valid values are: `text`, `password`, `email`, `url`, `tel`.
     */
    type?: TFieldType;
    /**
     * Sets target `<datalist>` element ID.
     */
    datalist?: string;
    /**
     * Enable toggle password field.
     */
    passwordToggle?: boolean;
    /**
     * Sets `<input>` element maximum characters allowed.
     */
    maxlength?: Numberish;
    /**
     * Sets `<input>` element minimum characters allowed.
     */
    minlength?: Numberish;
    /**
     * Create this component with **rounded-pill** appearance.
     */
    rounded?: boolean;
    /**
     * Prepend inline non-modifiable text before the input field.
     */
    prefix?: string;
    /**
     * Append inline non-modifiable text after the input field.
     */
    suffix?: string;
};
declare type TTextAreaOptionProps = TInputTextProps & {
    /**
     * Sets browsers `autocomplete` predictions on/off.
     */
    autoGrow?: boolean | string;
    /**
     * Disable resizing the `<textarea>` element.
     */
    noResize?: boolean;
    /**
     * The value monitored by `v-model` to maintain this field value.
     */
    modelValue?: string | null;
    /**
     * Sets `<textarea>` height in rows.
     */
    rows?: Numberish;
    /**
     * Sets `<textarea>` height in pixel.
     */
    rowHeight?: Numberish;
};
declare type TChipFieldOptionProps = TInputTextProps & {
    /**
     * The default Chips color to apply.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`, `default`.
     */
    chipColor?: TExtendedContextColor | string;
    /**
     * When defined, display the close button on every Chip to delete a Chip.
     */
    chipDeletable?: boolean;
    /**
     * Render the Chips with rounded-pill style.
     */
    chipPill?: boolean;
    /**
     * Render the Chips with outlined style.
     */
    chipOutlined?: boolean;
    /**
     * The value monitored by `v-model` to maintain this field value.
     */
    modelValue?: string | string[] | null;
};
declare type TNumericOptions = {
    locale: string;
    step: number;
    maxValue?: number;
    minValue?: number;
};
declare type TNumericFieldOptionProps = TInputTextProps & {
    /**
     * The value monitored by `v-model` to maintain this field value.
     */
    modelValue?: number | null;
    /**
     * The locale to be used when displaying the numeric value.
     * Defaults is using browser's locale.
     */
    locale?: string;
    /**
     * Shows the **Up-Down** or **Plus-Minus** action buttons which is used to
     * <b>increment</b> / <b>decrement</b> the numeric value.
     */
    actionButton?: TActionButtonType;
    /**
     * Sets the **Up-Down** or **Plus-Minus** action buttons placement,
     * valid values: `left`, `right` and `both`.
     */
    actionButtonPlacement?: TActionButtonPlacement;
    /**
     * Sets the maximum allowed fraction or decimal digits for the displayed value.
     */
    maxFraction?: Numberish;
    /**
     * Sets the maximum allowed value.
     */
    maxValue?: Numberish;
    /**
     * Sets the minimum allowed value.
     */
    minValue?: Numberish;
    /**
     * Sets the increment/decrement steps value.
     */
    step?: Numberish;
    /**
     * Format the displayed numeric value with digit grouping.
     */
    useGrouping?: boolean;
    /**
     * Create this component with **rounded-pill** appearance.
     */
    rounded?: boolean;
    /**
     * Prepend inline non-modifiable text before the input field.
     */
    prefix?: string;
    /**
     * Append inline non-modifiable text after the input field.
     */
    suffix?: string;
};
declare type TSearchFieldOptionProps = {
    /**
     * Sets `<input>` element ID attribute. This property value is auto generates.
     */
    id?: string;
    /**
     * Sets `<input>` element name attribute.
     */
    name?: string;
    /**
     * Enable/disable the component and the `<input>` element.
     */
    disabled?: boolean;
    /**
     * Put the component in readonly state and sets the `<input>` element readonly attribute.
     */
    readonly?: boolean;
    /**
     * Autofocus field when document is loaded.
     */
    autofocus?: boolean;
    /**
     * Enable advance search panel. If true then Popover container will be enabled.
     */
    advanceSearch?: boolean;
    /**
     * Sets the field placeholder.
     */
    placeholder?: string;
    /**
     * Adapts search field to the container background color.
     */
    darkMode?: boolean;
    /**
     * Minimum characters to check before triggers the search event.
     */
    minlength?: Numberish;
    /**
     * The value monitored by v-model to maintain field value.
     */
    modelValue?: string | null;
    /**
     * Custom CSS class for the Popover container.
     */
    popoverCls?: string | string[];
    /**
     * Sets minimum width for the Popover container.
     */
    popoverMinWidth?: Numberish;
    /**
     * Open or close the advance search popover panel. Only works if
     * `advanceSearch` is sets to `true`.
     */
    popoverOpen?: boolean;
    /**
     * Sets the Popover display placement.
     */
    popoverPlacement?: TPopoverPosition;
    /**
     * Sets animation transition when displaying the Popover container.
     */
    popoverTransition?: string;
};
declare type TBsTextField = ComponentObjectPropsOptions<TTextFieldOptionProps>;
declare type TBsTextArea = ComponentObjectPropsOptions<TTextAreaOptionProps>;
declare type TBsChipField = ComponentObjectPropsOptions<TChipFieldOptionProps>;
declare type TBsNumericField = ComponentObjectPropsOptions<TNumericFieldOptionProps>;
declare type TBsSearchField = ComponentObjectPropsOptions<TSearchFieldOptionProps>;

declare type TButtonColor = 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info' | 'light' | 'dark' | 'default';
declare type TButtonMode = 'default' | 'icon' | 'fab';
declare type TButtonType = 'button' | 'submit' | 'reset';
declare type TButtonSize = 'xs' | 'sm' | 'lg';
declare type TIconPosition = 'left' | 'right';
declare type TButtonInnerOptionProps = {
    dropdownToggle?: boolean;
    hasIcon?: boolean;
    iconMode?: boolean;
    rippleOff?: boolean;
};
declare type TButtonBaseProps = {
    /**
     * Sets this button color.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`,
     * `dark`, `default`.
     */
    color?: TButtonColor | string;
    /**
     * Render this button with flat style like Google Material
     * [Text Button](https://m3.material.io/components/buttons/specs).
     */
    flat?: boolean;
    /**
     * Render this button with outlined style like Google Material
     * [Outlined Button](https://m3.material.io/components/buttons/specs).
     */
    outlined?: boolean;
    /**
     * Render this button with raised style like Google Material
     * [Elevated Button](https://m3.material.io/components/buttons/specs).
     */
    raised?: boolean;
    /**
     * Enable filled tonal button style.
     */
    tonal?: boolean;
    /**
     * Render this button with rounded style.
     * @see [Bootstrap Buttons](https://getbootstrap.com/docs/5.3/components/buttons/)
     */
    rounded?: boolean;
    /**
     * Render button with rounded-pill style like Google Material
     * [Button](https://m3.material.io/components/buttons/specs).
     */
    pill?: boolean;
    /**
     * An alternative way to turn off the **rounded-pill** style.
     */
    pillOff?: boolean;
    /**
     * This button size.
     * @see [Bootstrap Button Size](https://getbootstrap.com/docs/5.3/components/buttons/#sizes)
     */
    size?: TButtonSize;
};
declare type TCustomIconProps = {
    /**
     * Apply custom CSS class to the icon.
     */
    iconClass?: TClassList;
    /**
     * Place icon on the `left` side (before text) or on the `right` side (after text).
     */
    iconPosition?: TIconPosition;
    /**
     * Render the icon with equal height and width.
     */
    iconSize?: Numberish;
};
declare type TButtonOptionProps = TAllowedIconProps & TCustomIconProps & TButtonBaseProps & {
    /**
     * Sets this button state: `active` or `normal`.
     */
    active?: boolean;
    /**
     * Sets this button state: `enabled` or `disabled`.
     */
    disabled?: boolean;
    /**
     * Sets this button state to `readonly`.
     */
    readonly?: boolean;
    /**
     * This button component mode, valid values are: `default, icon, fab, floating`.
     *
     * `floating` is deprecated, use `fab` instead.
     */
    mode?: TButtonMode;
    /**
     * Render this button component as dropdowns button.
     * @see [Bootstrap Dropdowns](https://getbootstrap.com/docs/5.3/components/dropdowns/)
     */
    dropdownToggle?: boolean;
    /**
     * Render component as `<a>` element and define its `href` property and
     * apply button styles to the element.
     */
    href?: string;
    /**
     * Disable the **ripple** effect.
     */
    rippleOff?: boolean;
    /**
     * The value to set to the button’s type attribute. Valid values are: `button`, `submit`, `reset`.
     */
    type?: TButtonType;
};
declare type TCloseButtonOptionProps = {
    /**
     * Sets this button color.
     */
    color?: TButtonColor;
    /**
     * Render this button with flat style like Google Material
     * [Text Button](https://m3.material.io/components/buttons/specs).
     */
    flat?: boolean;
    /**
     * Enable filled tonal button style.
     */
    tonal?: boolean;
    /**
     * Sets this button state: `enabled` or `disabled`.
     */
    disabled?: boolean;
    /**
     * Sets this button state to `readonly`.
     */
    readonly?: boolean;
    /**
     * Disable the **ripple** effect.
     */
    rippleOff?: boolean;
};
declare type TInputOptionItem = TAllowedIconProps & {
    /**
     * HTML `<input>` element ID.
     */
    id?: string;
    /**
     * HTML `<input>` element name. It is used when `multiple` is `true`.
     */
    name?: string;
    /**
     * HTML `<input>` element state and input item state.
     */
    disabled?: boolean;
    /**
     * HTML `<input>` element state and input item state.
     */
    readonly?: boolean;
    /**
     * Input item value.
     */
    value: string | number;
    /**
     * Input item label. If not sets then it will be assigned from `value` property.
     */
    label?: string;
    /**
     * Render the icon with equal height and width.
     */
    iconSize?: number;
};
declare type AllowedButtonProps = Omit<TButtonBaseProps, 'flat'>;
declare type TToggleButtonOptionProps = TInputBaseProps & AllowedButtonProps & {
    /**
     * The number of items stored in the collection.
     */
    items: TInputOptionItem[];
    /**
     * Allow multiple choice or not.
     */
    multiple?: boolean;
    /**
     * The input value to be monitored by `v-model`.
     */
    modelValue?: MaybeNumberish | boolean | unknown[];
    /**
     * Color to apply when Button is active or selected.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`,
     * `dark`, `default`.
     */
    toggleColor?: TButtonColor | string;
    /**
     * Place icon on the `left` side (before text) or on the `right` side (after text).
     */
    iconPosition?: TIconPosition;
    /**
     * Render the icon with equal height and width.
     */
    iconSize?: Numberish;
};
declare type TToggleFieldOptionProps = TToggleButtonOptionProps & TValidationProps;
declare type TBsButtonInner = ComponentObjectPropsOptions<TButtonInnerOptionProps>;
declare type TBsButton = ComponentObjectPropsOptions<TButtonOptionProps>;
declare type TBsCloseButton = ComponentObjectPropsOptions<TCloseButtonOptionProps>;
declare type TBsToggleButton = ComponentObjectPropsOptions<TToggleButtonOptionProps>;
declare type TBsToggleField = ComponentObjectPropsOptions<TToggleFieldOptionProps>;

declare const _default$J: DefineComponent<TBsButton, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TButtonOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsButton>, SlotsType<ButtonSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare interface ButtonSlots extends VoidDefaultSlots {
    /**
     * Additional slot used to place the custom button icon.
     */
    icon?: () => VNode[] | VNode;
}

declare const _default$I: DefineComponent<TBsCloseButton, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TCloseButtonOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsCloseButton>, {}, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$H: DefineComponent<TBsToggleButton, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ToggleButtonEventProps, string, PublicProps, Readonly<TToggleButtonOptionProps> & Readonly<ToggleButtonEventPublic>, ExtractDefaultPropTypes<TBsToggleButton>, SlotsType<ToggleButtonSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type ToggleButtonEventProps = UpdateModelValueEventProps<MaybeNumberish | unknown[]>;
declare interface ToggleButtonEventPublic extends UpdateModelValueEventPublic<MaybeNumberish | unknown[]> {
}
declare interface ToggleButtonSlots {
    /**
     * The default slot used to place the ToggleButton's label.
     */
    label?: (item: TInputOptionItem) => VNode[] | VNode;
    /**
     * Additional slot used to place the ToggleButton's icon.
     */
    icon?: (item: TInputOptionItem) => VNode[] | VNode;
}

declare const _default$G: DefineComponent<TBsToggleField, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ToggleFieldEventProps, string, PublicProps, Readonly<TToggleFieldOptionProps> & Readonly<ToggleFieldEventPublic>, ExtractDefaultPropTypes<TBsToggleField>, SlotsType<ToggleFieldSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type ToggleFieldEventProps = UpdateModelValueEventProps<MaybeNumberish | unknown[]>;
declare interface ToggleFieldEventPublic extends UpdateModelValueEventPublic<MaybeNumberish | unknown[]> {
}
declare interface ToggleFieldSlots extends VoidDefaultSlots {
    /**
     * The default slot used to place custom item's label of the ToggleField.
     */
    label?: (props: TInputOptionItem) => VNode[] | VNode;
    /**
     * Additional slot used to place custom item's icon of the ToggleField.
     */
    icon?: (props: TInputOptionItem) => VNode[] | VNode;
    /**
     * Additional slot used to place custom help text of the ToggleField.
     */
    'help-text'?: () => VNode[] | VNode;
}

declare const BsButtonPlugin: ObjectPlugin;

declare type TAlertVariant = 'success' | 'info' | 'warning' | 'danger' | 'help';
declare type TAlertOptionProps = TAllowedIconProps & {
    /**
     * Alert color.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`, `default`.
     */
    color?: TExtendedContextColor | string;
    /**
     * Define close button color explicitly.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`,
     * `dark`, `default`.
     */
    closeButtonColor?: TButtonColor | string;
    /**
     * When sets, display the close button to dismiss/hide the component.
     */
    dismissible?: boolean;
    /**
     * Create alert with solid fill style.
     */
    filled?: boolean;
    /**
     * The value monitored by `v-model` to display or hide the alert component.
     */
    modelValue?: boolean;
    /**
     * Create outlined alert style.
     */
    outlined?: boolean;
    /**
     * The component animation transition to display/hide.
     */
    transition?: string;
    /**
     * Use predefined icon to create contextual alert.
     */
    variant?: TAlertVariant;
};
declare type TBsAlert = ComponentObjectPropsOptions<TAlertOptionProps>;

declare const _default$F: DefineComponent<TBsAlert, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, AlertEventProps, string, PublicProps, Readonly<TAlertOptionProps> & Readonly<AlertEventPublic>, ExtractDefaultPropTypes<TBsAlert>, SlotsType<AlertSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type AlertEventProps = ClosableVoidEventProps & UpdateModelValueEventProps<boolean>;
declare interface AlertEventPublic extends ClosableVoidEventPublic, UpdateModelValueEventPublic<boolean> {
}
declare interface AlertSlots extends VoidDefaultSlots {
    /**
     * Additional slot used to place the custom icon.
     */
    icon?: () => VNode[] | VNode;
}

declare const BsAlertPlugin: ObjectPlugin;

declare type TBadgeType = 'label' | 'pill';
declare type TBadgeVariant = 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'info' | 'light';
declare type TBadgeOptionProps = {
    /**
     * This badge color appearance.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`, `default`.
     */
    color?: TExtendedContextColor | string;
    /**
     * Create outlined badge style.
     */
    outlined?: boolean;
    /**
     * Html tag used to render this badge.
     */
    tag?: HtmlTagName | string;
    /**
     * Create badge with `pill` or `label` style.
     */
    type?: TBadgeType;
    /**
     * Create contextual badge with
     * [Bootstrap badge color](https://getbootstrap.com/docs/5.3/components/badge/#background-colors).
     */
    variant?: TBadgeVariant;
};
declare type TBsBadge = ComponentObjectPropsOptions<TBadgeOptionProps>;

declare const _default$E: DefineComponent<TBsBadge, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TBadgeOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsBadge>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const BsBadgePlugin: ObjectPlugin;

declare type TChipSize = 'sm' | 'lg';
declare type TChipValue = {
    id: string;
    text: string;
    value?: Numberish | boolean;
};
declare type TChipContainer = {
    contentId: string;
    contentWidth: number;
    wrapperId: string;
    wrapperWidth: number;
};
declare type TChipOptionItem = TAllowedIconProps & {
    id?: string;
    disabled?: boolean;
    dismissible?: boolean;
    imgSrc?: string;
    href?: string;
    text: string;
    value?: Numberish | boolean;
};
declare type TChipBaseProps = {
    /**
     * Custom CSS class to apply when this Chip is in active state.
     */
    activeClass?: string;
    /**
     * The default color to apply to this Chip.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`, `default`.
     */
    color?: TExtendedContextColor | string;
    /**
     * Apply custom color to the **close button**.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`,
     * `dark`, `default`.
     */
    closeButtonColor?: TButtonColor | string;
    /**
     * Create chip's avatar with **circle shape** style.
     */
    imgCircle?: boolean;
    /**
     * Adjust avatar size to match the Chip's height by eliminating the margin around the avatar.
     */
    imgPaddingOff?: boolean;
    /**
     * Render this Chip with **outlined** style or not.
     */
    outlined?: boolean;
    /**
     * Render this Chip with **rounded-pill** style.
     */
    pill?: boolean;
    /**
     * Create this component with predefined size, valid values are: `sm` (small), `lg` (large).
     */
    size?: TChipSize;
};
declare type TChipOptionProps = TAllowedIconProps & TChipBaseProps & {
    /**
     * Sets this component state: `active` or `normal`.
     */
    active?: boolean;
    /**
     * Sets this component state to `disabled`.
     */
    disabled?: boolean;
    /**
     * Sets this component state to `readonly`.
     */
    readonly?: boolean;
    /**
     * When sets, display the **close button** to dismiss/hide this component.
     */
    dismissible?: boolean;
    /**
     * Render as `<a>` element and define its `href` property and apply chip styles to the element.
     */
    href?: string;
    /**
     * Enable avatar and set the image location url.
     */
    imgSrc?: string;
    /**
     * The value monitored by `v-model` to show or hide this component.
     */
    modelValue?: boolean;
    /**
     * Enabled or disabled ripple effect.
     * Ripple effect is automatically disabled when `click` event or `href` property is not defined.
     */
    rippleOff?: boolean;
    /**
     * Place icon on the `left` side (before text) or on the `right` side (after text).
     */
    iconPosition?: TIconPosition;
};
declare type TChipGroupOptionProps = TChipBaseProps & {
    /**
     * Show checked icon when the Chip is selected.
     */
    checkedIcon?: boolean;
    /**
     * Enable multi rows if total width of items beyond the container width.
     */
    column?: boolean;
    /**
     * The collection of `<BsChip>` property-value.
     */
    items: TChipOptionItem[];
    /**
     * The value monitored by `v-model` for the selected items.
     */
    modelValue?: TChipValue | TChipValue[];
    /**
     * Allow multiple selection or not.
     */
    multiple?: boolean;
    /**
     * Show slider's button or not.
     */
    sliderButton?: boolean;
    /**
     * Slider button color appearance.
     */
    sliderButtonColor?: string;
};
declare type TBsChip = ComponentObjectPropsOptions<TChipOptionProps>;
declare type TBsChipGroup = ComponentObjectPropsOptions<TChipGroupOptionProps>;

declare const _default$D: DefineComponent<TBsChip, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ChipEventProps, string, PublicProps, Readonly<TChipOptionProps> & Readonly<ChipEventPublic>, ExtractDefaultPropTypes<TBsChip>, SlotsType<ChipSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type ChipEventProps = ClosableVoidEventProps & UpdateModelValueEventProps<boolean> & {
    /**
     * Fired when the Chip's component state is updated.
     */
    'update:active'?: (active: boolean) => void;
};
declare interface ChipEventPublic extends ClosableVoidEventPublic, UpdateModelValueEventPublic<boolean> {
    /**
     * Fired when the Chip's component state is updated.
     */
    'onUpdate:active'?: (active: boolean) => void;
    /**
     * Fired when the Chip's component state is updated.
     */
    '@update:active'?: (active: boolean) => void;
}
declare interface ChipSlots extends VoidDefaultSlots {
    /**
     * Additional slot used to place the custom icon of the Chip component.
     */
    icon?: () => VNode[] | VNode;
}

declare const _default$C: DefineComponent<TBsChipGroup, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ChipGroupEventProps, string, PublicProps, Readonly<TChipGroupOptionProps> & Readonly<ChipGroupEventPublic>, ExtractDefaultPropTypes<TBsChipGroup>, SlotsType<ChipGroupSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type ChipGroupEventProps = UpdateModelValueEventProps<TChipValue | TChipValue[] | null> & {
    /**
     * Fired immediately when this component's value is changed.
     */
    change?: (newValue: TChipValue | TChipValue[] | null) => void;
    /**
     * Fired when this component's item is dismissed (hide).
     */
    'item:close'?: (active: boolean) => void;
};
declare interface ChipGroupEventPublic extends UpdateModelValueEventPublic<TChipValue | TChipValue[] | null> {
    /**
     * Fired immediately when this component's value is changed.
     */
    onChange?: (newValue: TChipValue | TChipValue[] | null) => void;
    /**
     * Fired when this component's item is dismissed (hide).
     */
    'onItem:close'?: (dismissedItem: TChipValue) => void;
    /**
     * Fired immediately when this component's value is changed.
     */
    '@change'?: (newValue: TChipValue | TChipValue[] | null) => void;
    /**
     * Fired when this component's item is dismissed (hide).
     */
    '@item:close'?: (dismissedItem: TChipValue) => void;
}
declare interface ChipGroupSlots extends VoidDefaultSlots {
    /**
     * Additional slot used to place the item's custom text of the Chip component.
     */
    text?: (props: TChipOptionItem) => VNode[] | VNode;
    /**
     * Additional slot used to place the item's custom icon of the ChipGroup component.
     */
    icon?: (props: TChipOptionItem) => VNode[] | VNode;
}

declare const BsChipPlugin: ObjectPlugin;

declare type FieldEventProps<T> = UpdateModelValueEventProps<T> & {
    /**
     * Fired when this Field's value is being cleared.
     */
    clear?: VoidFunction;
    /**
     * Fired when this Field lost focus.
     */
    blur?: EventListener;
    /**
     * Fired when this Field got focused.
     */
    focus?: EventListener;
};
declare interface FieldEventPublic<T> extends UpdateModelValueEventPublic<T> {
    /**
     * Fired when this Field's value is being cleared.
     */
    onClear?: VoidFunction;
    /**
     * Fired when this Field lost focus.
     */
    onBlur?: EventListener;
    /**
     * Fired when this Field got focused.
     */
    onFocus?: EventListener;
    /**
     * Fired when this Field's value is being cleared.
     */
    '@clear'?: VoidFunction;
    /**
     * Fired when this Field lost focus.
     */
    '@blur'?: EventListener;
    /**
     * Fired when this Field got focused.
     */
    '@focus'?: EventListener;
}
declare interface FieldSlots {
    /**
     * The default slot used to place the Field's label.
     */
    default?: (arg: {
        id: string;
    }) => VNode[] | VNode;
    /**
     * Additional slot used to place custom icon or component at the inner right side.
     */
    'append-inner'?: () => VNode[] | VNode;
    /**
     * Additional slot used to place custom icon or component at the outer right side.
     */
    'append-outer'?: () => VNode[] | VNode;
    /**
     * Additional slot used to place custom icon or component at the inner left side.
     */
    'prepend-inner'?: () => VNode[] | VNode;
    /**
     * Additional slot used to place custom icon or component at the outer left side.
     */
    'prepend-outer'?: () => VNode[] | VNode;
    /**
     * Additional slot used to place custom help text.
     */
    'help-text'?: () => VNode[] | VNode;
}
declare type ChipFieldEventProps = FieldEventProps<string | string[]> & {
    /**
     * Fired when `KeyboardEvent` is triggered by the `<input>` element.
     */
    keydown?: EventListener;
    /**
     * Fired when an item is deleted from the collection.
     */
    'delete-item'?: (deletedItem: string) => void;
};
declare interface ChipFieldEventPublic extends FieldEventPublic<string | string[]> {
    /**
     * Fired when `KeyboardEvent` is triggered by the `<input>` element.
     */
    keydown?: EventListener;
    /**
     * Fired when an item is deleted from the collection.
     */
    'delete-item'?: (deletedItem: string) => void;
}
declare type NumericFieldEventProps = FieldEventProps<MaybeNumber> & {
    /**
     * Fired when `KeyboardEvent` is triggered by the `<input>` element.
     */
    keydown?: EventListener;
};
declare interface NumericFieldEventPublic extends FieldEventPublic<MaybeNumber> {
    /**
     * Fired when `KeyboardEvent` is triggered by the `<input>` element.
     */
    keydown?: EventListener;
}
declare type SearchFieldEventProps = FieldEventProps<MaybeString> & {
    /**
     * Fired when the Popover is hiding.
     */
    close?: VoidFunction;
    /**
     * Fired when the Popover is show.
     */
    open?: VoidFunction;
    /**
     * Asks handler to start searching for the given keyword.
     */
    search?: (value: string) => void;
};
declare interface SearchFieldEventPublic extends FieldEventPublic<MaybeString> {
    /**
     * Fired when the Popover is hiding.
     */
    onClose?: VoidFunction;
    /**
     * Fired when the Popover is show.
     */
    onOpen?: VoidFunction;
    /**
     * Asks handler to start searching for the given keyword.
     */
    onSearch?: (value: string) => void;
    /**
     * Fired when the Popover is hiding.
     */
    '@close'?: VoidFunction;
    /**
     * Fired when the Popover is show.
     */
    '@open'?: VoidFunction;
    /**
     * Asks handler to start searching for the given keyword.
     */
    '@search'?: (value: string) => void;
}
declare type TextAreaEventProps = FieldEventProps<MaybeString> & {
    /**
     * Fired when `KeyboardEvent` is triggered by the `<textarea>` element.
     */
    keydown?: EventListener;
};
declare interface TextAreaEventPublic extends FieldEventPublic<MaybeString> {
    /**
     * Fired when `KeyboardEvent` is triggered by the `<textarea>` element.
     */
    keydown?: EventListener;
}
declare type TextFieldEventProps = FieldEventProps<MaybeNumberish> & {
    /**
     * Fired when `KeyboardEvent` is triggered by the `<input>` element.
     */
    keydown?: EventListener;
};
declare interface TextFieldEventPublic extends FieldEventPublic<MaybeNumberish> {
    /**
     * Fired when `KeyboardEvent` is triggered by the `<input>` element.
     */
    keydown?: EventListener;
}

declare const _default$B: DefineComponent<TBsChipField, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ChipFieldEventProps, string, PublicProps, Readonly<TChipFieldOptionProps> & Readonly<ChipFieldEventPublic>, ExtractDefaultPropTypes<TBsChipField>, SlotsType<FieldSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$A: DefineComponent<TBsNumericField, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, NumericFieldEventProps, string, PublicProps, Readonly<TNumericFieldOptionProps> & Readonly<NumericFieldEventPublic>, ExtractDefaultPropTypes<TBsNumericField>, SlotsType<FieldSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$z: DefineComponent<TBsSearchField, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, SearchFieldEventProps, string, PublicProps, Readonly<TSearchFieldOptionProps> & Readonly<SearchFieldEventPublic>, ExtractDefaultPropTypes<TBsSearchField>, SlotsType<SearchFieldSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare interface SearchFieldSlots {
    /**
     * The default slot used to place one or more components inside the popover.
     */
    popover?: () => VNode[];
}

declare const _default$y: DefineComponent<TBsTextArea, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, TextAreaEventProps, string, PublicProps, Readonly<TTextAreaOptionProps> & Readonly<TextAreaEventPublic>, ExtractDefaultPropTypes<TBsTextArea>, SlotsType<FieldSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$x: DefineComponent<TBsTextField, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, TextFieldEventProps, string, PublicProps, Readonly<TTextFieldOptionProps> & Readonly<TextFieldEventPublic>, ExtractDefaultPropTypes<TBsTextField>, SlotsType<FieldSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const BsFieldPlugin: ObjectPlugin;

declare interface TRadioInputProps {
    /**
     * Sets the `<input>` element `ID` attribute. This property value is auto generates.
     */
    id?: string;
    /**
     * Sets the `<input>` element `name` attribute.
     */
    name?: Numberish;
    /**
     * This input field state: enabled or disabled.
     */
    disabled?: boolean;
    /**
     * Sets this input field into readonly state.
     */
    readonly?: boolean;
    /**
     * Sets this component color.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `default`.
     */
    color?: TContextColor | string;
    /**
     * The `<input>` element `value` attribute.
     */
    value: Numberish | boolean | unknown;
    /**
     * The text label to display.
     */
    label: string;
}
declare type TRadioOptionProps = TInputBaseProps & {
    /**
     * Sets this component color.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `default`.
     */
    color?: TContextColor | string;
    /**
     * The `<input>` element `value` attribute.
     */
    value?: Numberish | boolean | unknown;
    /**
     * The input value to be monitored by `v-model`.
     */
    modelValue?: Numberish | boolean | unknown;
};
declare type TRadioGroupOptionProps = TInputGroupProps<TRadioInputProps, Numberish | boolean | unknown>;
declare type TBsRadio = ComponentObjectPropsOptions<TRadioOptionProps>;
declare type TBsRadioGroup = ComponentObjectPropsOptions<TRadioGroupOptionProps>;

declare type TInputGroupProps<D, M> = TInputBaseProps & TValidationProps & {
    /**
     * Sets this component color.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `default`.
     */
    color?: TContextColor | string;
    /**
     * Sets the maximum number of columns to display the checkbox or radio-button.
     * When the number of items exceed the number of columns, then the remaining
     * items will be displayed on the next row. The maximum number of columns
     * must be less than 7.
     */
    column?: Numberish;
    /**
     * The collection of `<bs-radio>` or `<bs-checkbox>` property-value.
     */
    items: D[];
    /**
     * The value monitored by `v-model` to maintain the checked state.
     */
    modelValue?: M;
};
declare interface TCheckboxInputProps extends TRadioInputProps {
    indeterminate?: boolean;
}
declare type TCheckboxOptionProps = TRadioOptionProps & {
    indeterminate?: boolean;
};
declare type TCheckboxGroupOptionProps = TInputGroupProps<TCheckboxInputProps, Numberish[] | unknown[]> & {
    indeterminate?: boolean;
};
declare type TBsCheckbox = ComponentObjectPropsOptions<TCheckboxOptionProps>;
declare type TBsCheckboxGroup = ComponentObjectPropsOptions<TCheckboxGroupOptionProps>;

declare const _default$w: DefineComponent<TBsCheckbox, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, CheckboxEventProps, string, PublicProps, Readonly<TCheckboxOptionProps> & Readonly<CheckboxEventPublic>, ExtractDefaultPropTypes<TBsCheckbox>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type CheckboxEventProps = UpdateModelValueEventProps<Numberish | boolean | null> & {
    /**
     * Fired when this checkbox component's "checked" state is updated.
     */
    checked?: (checked: boolean) => void;
};
declare interface CheckboxEventPublic extends UpdateModelValueEventPublic<Numberish | boolean | null> {
    /**
     * Fired when this checkbox component's "checked" state is updated.
     */
    onChecked?: (checked: boolean) => void;
    /**
     * Fired when this checkbox component's "checked" state is updated.
     */
    '@checked'?: (checked: boolean) => void;
}

declare const _default$v: DefineComponent<TBsCheckboxGroup, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, CheckboxGroupEventProps, string, PublicProps, Readonly<TCheckboxGroupOptionProps> & Readonly<CheckboxGroupEventPublic>, ExtractDefaultPropTypes<TBsCheckboxGroup>, SlotsType<CheckboxGroupSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type CheckboxGroupEventProps = UpdateModelValueEventProps<(string | number | unknown)[]>;
declare interface CheckboxGroupEventPublic extends UpdateModelValueEventPublic<(string | number | unknown)[]> {
}
declare interface CheckboxGroupSlots extends VoidDefaultSlots {
    /**
     * The default slot used to place the custom help text of the CheckboxGroup.
     */
    'help-text'?: () => VNode[] | VNode;
}

declare const BsCheckboxPlugin: ObjectPlugin;

declare const _default$u: DefineComponent<TBsRadio, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, RadioEventProps, string, PublicProps, Readonly<TRadioOptionProps> & Readonly<RadioEventPublic>, ExtractDefaultPropTypes<TBsRadio>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, never>;

declare type RadioEventProps = UpdateModelValueEventProps<Numberish | boolean | null> & {
    /**
     * Fired when this Radio component's "checked" state is updated.
     */
    checked?: (checked: boolean) => void;
};
declare interface RadioEventPublic extends UpdateModelValueEventPublic<Numberish | boolean | null> {
    /**
     * Fired when this Radio component's "checked" state is updated.
     */
    onChecked?: (checked: boolean) => void;
    /**
     * Fired when this Radio component's "checked" state is updated.
     */
    '@checked'?: (checked: boolean) => void;
}

declare const _default$t: DefineComponent<TBsRadioGroup, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, RadioGroupEventProps, string, PublicProps, Readonly<TRadioGroupOptionProps> & Readonly<RadioGroupEventPublic>, ExtractDefaultPropTypes<TBsRadioGroup>, SlotsType<RadioGroupSlots>, {}, {}, string, ComponentProvideOptions, false, never>;

declare type RadioGroupEventProps = UpdateModelValueEventProps<Numberish | boolean>;
declare interface RadioGroupEventPublic extends UpdateModelValueEventPublic<Numberish | boolean> {
}
declare interface RadioGroupSlots extends VoidDefaultSlots {
    /**
     * The default slot used to place the custom help text of the RadioGroup.
     */
    'help-text'?: () => VNode[] | VNode;
}

declare const BsRadioPlugin: ObjectPlugin;

declare type TLabelPosition = 'left' | 'right';
declare type TSwitchVariant = 'default' | 'inset' | 'outline-inset';
declare type TSwitchOptionProps = TRadioOptionProps & {
    /**
     * Additional CSS class for the text label.
     */
    labelClass?: string | string[];
    /**
     * The switch text label position, valid values are: `left`, `right`.
     */
    labelPosition?: TLabelPosition;
    /**
     * Sets the switch style appearance. Valid values are: `default`, `inset`, `outline-inset`.
     *
     * @see [Switch Material Design](https://m3.material.io/components/switch/overview)
     */
    variant?: TSwitchVariant;
    /**
     * Sets the switch style appearance to **Inset style**.
     *
     * @deprecated Use `variant` instead.
     */
    insetMode?: boolean;
    /**
     * Sets the switch style appearance to **Inset Outlined style**.
     *
     * @deprecated Use `variant` instead.
     */
    insetOutlined?: boolean;
    /**
     * Enable the component's thumb icon when the component is on _**unchecked**_ state.
     */
    checkoffIcon?: boolean;
    /**
     * Enable the component's thumb icon when the component is on _**checked**_ state.
     */
    checkedIcon?: boolean;
};
declare type TBsSwitch = ComponentObjectPropsOptions<TSwitchOptionProps>;

declare const _default$s: DefineComponent<TBsSwitch, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, SwitchEventProps, string, PublicProps, Readonly<TSwitchOptionProps> & Readonly<SwitchEventPublic>, ExtractDefaultPropTypes<TBsSwitch>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type SwitchEventProps = UpdateModelValueEventProps<Numberish | boolean> & {
    /**
     * Fired when this Switch component's checked state is changed.
     */
    checked?: (checked: boolean) => void;
};
declare interface SwitchEventPublic extends UpdateModelValueEventPublic<Numberish | boolean> {
    /**
     * Fired when this Switch component's checked state is changed.
     */
    onChecked?: (checked: boolean) => void;
    /**
     * Fired when this Switch component's checked state is changed.
     */
    '@checked'?: (checked: boolean) => void;
}

declare const BsSwitchPlugin: ObjectPlugin;

declare type TSpaceAround = 'left' | 'right' | 'both' | 'none';
declare type TListItemBorder = 'left' | 'right' | 'left-right' | 'top' | 'bottom' | 'top-bottom';
declare type TListViewOptionProps = {
    /**
     * Apply custom color scheme to this ListView component.
     *
     * @deprecated
     * Use unified global CSS variable instead.
     */
    color?: string;
    /**
     * Apply css `overflow-hidden` or not.
     */
    overflowHidden?: boolean;
    /**
     * Highlight this ListView active item with **rounded** style on its edge corners.
     */
    itemRounded?: boolean;
    /**
     * Highlight this ListView active item with **rounded-pill** style on its edge corners.
     */
    itemRoundedPill?: boolean;
    /**
     * Give border around the ListView's active item.
     * Valid values are: `left`, `right`, `left-right`, `top`, `bottom`, `top-bottom`.
     */
    itemBorderVariant?: TListItemBorder;
    /**
     * If `false` then more than one item can be expanded.
     */
    singleExpand?: boolean;
    /**
     * The ListView doesn't manage each ListTile item's state.
     */
    individualState?: boolean;
    /**
     * Give some space around each item. Valid values are: `both`, `left`, `right`.
     */
    spaceAround?: TSpaceAround;
    /**
     * ReadOnly storage which hold this ListView's active item object instance.
     */
    modelValue?: ComponentInternalInstance;
};
declare type TListNavOptionProps = {
    /**
     * Sets this component `ID` attribute. This property value is auto generates.
     */
    id?: string;
    /**
     * Treat this component as child navigation container.
     */
    child?: boolean;
};
declare type TListNavItemOptionProps = TAllowedIconProps & TRouterOptionProps & {
    /**
     * Sets this component `ID` attribute. This property value is auto generates.
     */
    id?: string;
    /**
     * This component state.
     */
    active?: boolean;
    /**
     * Disable this component.
     */
    disabled?: boolean;
    /**
     * Item depth level in tree hierarchy.
     */
    depth?: Numberish;
    /**
     * Text indentation from left side.
     */
    indent?: Numberish;
    /**
     * Render the icon with fixed size.
     */
    iconSize?: Numberish;
    /**
     * The text to render as component label.
     */
    label: string;
    /**
     * The text to render as Badge label.
     */
    badge?: string;
    /**
     * The Badge color appearance.
     */
    badgeColor?: string;
    /**
     * The Badge with `pill` or `label` style.
     */
    badgeType?: TBadgeType;
    /**
     * The Badge variant, valid values: `primary`, `secondary`, `success`, `danger`, `warning`,
     * `info`, `light`.
     */
    badgeVariant?: TBadgeVariant;
    /**
     * Disable ListView `itemBorderVariant` feature on this component.
     */
    borderOff?: boolean;
    /**
     * Disable ListView `itemRoundedPill` feature on this component.
     */
    pillOff?: boolean;
    /**
     * Disable ListView `itemRounded` feature on this component.
     */
    roundedOff?: boolean;
    /**
     * Enabled or disabled ripple effect.
     */
    rippleOff?: boolean;
};
declare type TListTileOptionProps = TRouterOptionProps & {
    /**
     * Sets this component `ID` attribute. This property value is auto generates.
     */
    id?: string;
    /**
     * This component state.
     */
    active?: boolean;
    /**
     * Disable this component.
     */
    disabled?: boolean;
    /**
     * Render ListTile as menu item.
     */
    navigable?: boolean;
    /**
     * Disable ListView `itemBorderVariant` feature on this component.
     */
    borderOff?: boolean;
    /**
     * Disable ListView `itemRoundedPill` feature on this component.
     */
    pillOff?: boolean;
    /**
     * Disable ListView `itemRounded` feature on this component.
     */
    roundedOff?: boolean;
    /**
     * Enabled or disabled ripple effect.
     */
    rippleOff?: boolean;
};
declare type TListTileActionOptionProps = TTagProp & {
    /**
     * Center item inside it vertically.
     */
    center?: boolean;
    /**
     * Arrange item inside it vertically.
     */
    stack?: boolean;
};
declare type TListTileContentOptionProps = TTagProp & {
    /**
     * Useful when you want to display multiline text. The subtitle default will be display
     * in a single line, if the text length is beyond the container's width then the text will be
     * truncate with an ellipses at the end.
     */
    multiLine?: boolean;
};
declare type TListTileLeadingOptionProps = TAllowedIconProps & TAllowedImageProps & {
    /**
     * Center item inside it vertically.
     */
    center?: boolean;
};
declare type TListTileTextOptionProps = {
    /**
     * Useful when you want to display raw HTML content inside `ListTileTitle` or `ListTileSubtitle`.
     *
     * Dynamically rendering arbitrary HTML on your website can be very dangerous because it can
     * easily lead to XSS attacks. Only use this property on trusted content and never on
     * user-provided content.
     */
    rawHtml?: string;
};
declare type TBsListView = ComponentObjectPropsOptions<TListViewOptionProps>;
declare type TBsListNav = ComponentObjectPropsOptions<TListNavOptionProps>;
declare type TBsListNavItem = ComponentObjectPropsOptions<TListNavItemOptionProps>;
declare type TBsListTile = ComponentObjectPropsOptions<TListTileOptionProps>;
declare type TBsListTileAction = ComponentObjectPropsOptions<TListTileActionOptionProps>;
declare type TBsListTileContent = ComponentObjectPropsOptions<TListTileContentOptionProps>;
declare type TBsListTileLeading = ComponentObjectPropsOptions<TListTileLeadingOptionProps>;
declare type TBsListTileTitle = ComponentObjectPropsOptions<TListTileTextOptionProps>;
declare type TBsListTileSubtitle = ComponentObjectPropsOptions<TListTileTextOptionProps>;
/**
 * `<BsListNav>` component instance when exposed by `ref` attribute.
 */
declare interface BsListNavInstance extends ComponentPublicInstance {
    collapsing: Ref<boolean>;
    expanded: Ref<boolean>;
    isActive: Ref<boolean>;
}
/**
 * `<BsListNavItem>` component instance when exposed by `ref` attribute.
 */
declare interface BsListNavItemInstance extends ComponentPublicInstance {
    expanded: Ref<boolean>;
    isActive: Ref<boolean>;
}
/**
 * `<BsListTile>` component instance when exposed by `ref` attribute.
 */
declare interface BsListTileInstance extends ComponentPublicInstance {
    isActive: Ref<boolean>;
}

declare const _default$r: DefineComponent<TBsListNav, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TListNavOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsListNav>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare interface IListViewProvider extends ObjectBase {
    readonly config: Readonly<TListViewOptionProps>;
    readonly itemBorderVariant?: TListItemBorder;
    readonly itemRounded: boolean;
    readonly itemRoundedPill: boolean;
    readonly spaceAround?: TSpaceAround;
    readonly singleExpand: boolean;
    readonly items: IListItem[];
    /**
     * Get/Set the active item.
     */
    get activeItem(): IListItem | undefined;
    set activeItem(value: IListItem | undefined);
    /**
     * Add an item to the collection.
     *
     * @param item The item to add.
     * @returns The collection new length or `-1` if the item already exists.
     */
    addItem(item: IListItem): number;
    /**
     * The findItem() method returns the value of the first element in the provided array
     * that satisfies the provided testing function. If no values satisfy the testing function,
     * {@link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined undefined} is returned.
     */
    findItem(predicate: (value: IListItem, sources: IListItem[]) => boolean, recursive: boolean): IListItem | undefined;
    /**
     * Execute an action for each item with the provided callback.
     *
     * @param actionFn         The callback which will be executed.
     * @param recursive        When `TRUE` the callback will be executed for every child.
     * @param stopImmediately  When `TRUE` if the callback returns a result, function will be stopped immediately.
     */
    execAction(actionFn: (value: IListItem, sources: IListItem[]) => unknown, recursive: boolean, stopImmediately: boolean): Promise<void>;
    /**
     * Remove an item from the collection.
     *
     * @param item The item to remove.
     */
    removeItem(item: IListItem): void;
    /**
     * Sets the active item.
     *
     * @param value The item to assign as active.
     */
    setActiveItem(value?: IListItem): Promise<void>;
    /**
     * Collapse current item and hide its child-items.
     */
    collapse(item: IListItem): void;
    /**
     * Expand current item and show its child-items.
     */
    expand(item: IListItem): void;
}

declare interface IListTileEventEmitter {
    [key: string]: (...args: unknown[]) => void;
    click: (target: Event, node: RendererNode | null | undefined) => void;
    'update:active': (active: boolean) => void;
}

declare interface IListItem extends ObjectBase {
    readonly uid: string;
    readonly tag: string;
    readonly component: ComponentInternalInstance;
    readonly children: Array<IListItem>;
    /**
     * Get/Set the parent item.
     */
    get parent(): IListItem | undefined;
    set parent(value: IListItem | undefined);
    /**
     * Add or register an item to this ListItem registry.
     *
     * @param child The item to register.
     * @returns The registry new size or `-1` if the item already exists.
     */
    addChild(child: IListItem): number;
    /**
     * Remove an item from this ListItem registry.
     *
     * @param id The item identifier.
     */
    removeChild(id: string): void;
    /**
     * Check if this ListItem registry size is greater than zero.
     */
    hasChild(): boolean;
    /**
     * Emit an event from a ListItem.
     * @param name The event name
     * @param args The event arguments
     */
    fireEvent(name: keyof IListTileEventEmitter, ...args: unknown[]): void;
    fireEvent(name: string, ...args: unknown[]): void;
    setActive(value: boolean): void;
    setRippleOff(value: boolean): void;
}

declare type ListNavItemEventProps = {
    /**
     * Fired when this ListNavItem or ListTile is clicked.
     */
    click?: (target: Event, node: RendererNode | null) => void;
    /**
     * Fired when this ListNavItem or ListTile state is updated.
     */
    'update:active'?: (active: boolean) => void;
};
declare interface ListNavItemEventPublic {
    /**
     * Fired when this ListNavItem or ListTile is clicked.
     */
    onClick?: (target: Event, node: RendererNode | null) => void;
    /**
     * Fired when this ListNavItem or ListTile state is updated.
     */
    'onUpdate:active'?: (active: boolean) => void;
    /**
     * Fired when this ListNavItem or ListTile is clicked.
     */
    '@click'?: (target: Event, node: RendererNode | null) => void;
    /**
     * Fired when this ListNavItem or ListTile state is updated.
     */
    '@update:active'?: (active: boolean) => void;
}

declare const _default$q: DefineComponent<TBsListNavItem, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ListNavItemEventProps, string, PublicProps, Readonly<TListNavItemOptionProps> & Readonly<ListNavItemEventPublic>, ExtractDefaultPropTypes<TBsListNavItem>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$p: DefineComponent<TBsListTile, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ListNavItemEventProps, string, PublicProps, Readonly<TListTileOptionProps> & Readonly<ListNavItemEventPublic>, ExtractDefaultPropTypes<TBsListTile>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$o: DefineComponent<TBsListTileAction, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TListTileActionOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsListTileAction>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$n: DefineComponent<TBsListTileContent, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TListTileContentOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsListTileContent>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$m: DefineComponent<TBsListTileLeading, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TListTileLeadingOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsListTileLeading>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$l: DefineComponent<TBsListTileSubtitle, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TListTileTextOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsListTileSubtitle>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$k: DefineComponent<TBsListTileTitle, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TListTileTextOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsListTileTitle>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$j: DefineComponent<TBsListView, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ListViewEventProps, string, PublicProps, Readonly<TListViewOptionProps> & Readonly<ListViewEventPublic>, ExtractDefaultPropTypes<TBsListView>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type ListViewEventProps = UpdateModelValueEventProps<IListItem> & {
    /**
     * Fired when the ListView is mutated its modelValue.
     */
    change?: (value: IListItem, oldValue: IListItem) => void;
};
declare interface ListViewEventPublic extends UpdateModelValueEventPublic<IListItem> {
    /**
     * Fired when the ListView is mutated its modelValue.
     */
    onChange?: (value: IListItem, oldValue: IListItem) => void;
    /**
     * Fired when the ListView is mutated its modelValue.
     */
    '@change'?: (value: IListItem, oldValue: IListItem) => void;
}

declare const BsListViewPlugin: ObjectPlugin;

declare const _default$i: DefineComponent<TBsPopover, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, PopoverEventProps, string, PublicProps, Readonly<TPopoverOptionProps> & Readonly<PopoverEventPublic>, ExtractDefaultPropTypes<TBsPopover>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type PopoverEventProps = ClosableEventProps & UpdateOpenEventProps;
declare interface PopoverEventPublic extends ClosableEventPublic, UpdateOpenEventPublic {
}

declare const BsPopoverPlugin: ObjectPlugin;

declare type TDropdownMenuOptionProps = {
    /**
     * Display this Dropdown menu at a position which can cover the activator element.
     */
    cover?: boolean;
    /**
     * Disable this Dropdown menu and prevents it from displaying.
     */
    disabled?: boolean;
    /**
     * This Popup menu state: show or hide.
     */
    open?: boolean;
    /**
     * Triggers this Dropdown menu to display when `mouseenter` and hide when `mouseleave`.
     */
    openOnHover?: boolean;
    /**
     * Close or hide this Dropdown menu when content is clicked.
     */
    contentClickClose?: boolean;
    /**
     * This Dropdown menu container background color.
     *
     * @deprecated
     * Use unified global CSS variable instead.
     */
    color?: string;
    /**
     * Number of pixel to shift the Dropdown display position from the activator element.
     */
    space?: Numberish;
    /**
     * This Dropdown menu display placement.
     */
    placement?: TPopoverPosition;
    /**
     * Transition animation when displaying this Dropdown menu. This animation is
     * effected by `placement` property.
     */
    transition?: string;
};
declare type TBsDropdownMenu = ComponentObjectPropsOptions<TDropdownMenuOptionProps>;

declare const _default$h: DefineComponent<TBsDropdownMenu, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, DropdownMenuEventProps, string, PublicProps, Readonly<TDropdownMenuOptionProps> & Readonly<DropdownMenuEventPublic>, ExtractDefaultPropTypes<TBsDropdownMenu>, SlotsType<DropdownMenuSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare interface DropdownMenuSlots extends VoidDefaultSlots {
    /**
     * Additional slot used to place the dropdown-menu content.
     */
    content?: () => VNode[] | VNode;
}
declare type DropdownMenuEventProps = ClosableVoidEventProps & UpdateOpenEventProps;
declare interface DropdownMenuEventPublic extends ClosableVoidEventPublic, UpdateOpenEventPublic {
}

declare const BsMenuPlugin: ObjectPlugin;

declare type TAlignment = 'left' | 'start' | 'right' | 'end' | 'center' | 'justified';
declare type TOrientation = 'horizontal' | 'vertical';
declare type TPlacementPosition = 'left' | 'right' | 'top' | 'bottom';
declare type TTabsVariant = 'tabs' | 'pills' | 'modern' | 'material';
declare type TTabsBaseProps = {
    /**
     * Tabs style variant. Built in variants are: `tabs`, `pills`, `material`, `modern`.
     */
    variant?: TTabsVariant | string;
    /**
     * Tabs alignment. Valid values: `left`, `right`, `start`, `end`, `center`, `justified`.
     */
    alignment?: TAlignment;
    /**
     * Tab content display animation transition.
     */
    contentTransition?: string;
    /**
     * TabItem icon position. Valid values: `left`, `right`, `top`, `bottom`.
     */
    iconPosition?: TPlacementPosition;
    /**
     * TabItem icon size.
     */
    iconSize?: Numberish;
    /**
     * Optional TabItem CSS classes when TabItem isn't in active state.
     */
    tabClass?: string | string[];
    /**
     * Tabs position. Valid values: `left`, `right`, `top`, `bottom`.
     */
    tabPosition?: TPlacementPosition;
};
declare type TTabsOptionProps = TTabsBaseProps & {
    /**
     * Create Tabs with flex styles. Only valid for `tabs` or `pills` variant.
     */
    flex?: boolean;
    /**
     * Tabs color style for tab variant: `modern` and `material`.
     *
     * Must use valid CSS name for this to work properly, example: bg-primary, bg-indigo-600.
     */
    color?: string;
    /**
     * CSS class name for active TabItem.
     */
    activeClass?: string;
    /**
     * Optional, Tab content container CSS classes.
     */
    contentClass?: string | string[];
    /**
     * Optional, TabItem's container CSS classes.
     */
    innerClass?: string | string[];
    /**
     * The activeTab index or activeTab ID that monitored by `v-model`.
     */
    modelValue?: Numberish;
};
declare type TTabPanelOptionProps = TRouterOptionProps & TAllowedIconProps & {
    /**
     * TabItem ID, default is autogenerate.
     */
    id?: string;
    ariaLabel?: string;
    /**
     * Sets initial state for this TabItem as disabled.
     */
    disabled?: boolean;
    /**
     * Sets this TabItem's label.
     */
    label?: string;
};
declare type TTabItemOptionProps = TTabPanelOptionProps & {
    /**
     * Sets this TabItem as active or in-active.
     */
    active?: boolean;
};
declare type TTabLabelOptionProps = TAllowedIconProps & {
    tabPosition?: TPlacementPosition;
    iconPosition?: TPlacementPosition;
    iconSize?: Numberish;
    label?: string;
    rippleOff?: boolean;
};
declare type TBsTabs = ComponentObjectPropsOptions<TTabsOptionProps>;
declare type TBsTabItem = ComponentObjectPropsOptions<TTabItemOptionProps>;
declare type TBsTabPanel = ComponentObjectPropsOptions<TTabPanelOptionProps>;
declare type TBsTabLabel = ComponentObjectPropsOptions<TTabLabelOptionProps>;

declare const _default$g: DefineComponent<TBsTabPanel, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TTabPanelOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsTabPanel>, SlotsType<VoidDefaultSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$f: DefineComponent<TBsTabs, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, TabEventProps, string, PublicProps, Readonly<TTabsOptionProps> & Readonly<TabEventPublic>, ExtractDefaultPropTypes<TBsTabs>, SlotsType<TabSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare interface TabSlots extends VoidDefaultSlots {
    /**
     * Additional slot used to place custom components or elements on the right side of the Tabs.
     */
    'append-header'?: () => VNode[] | VNode;
}
declare type TabEventProps = UpdateModelValueEventProps<number> & {
    /**
     * Fired when active tab is changed.
     */
    change?: (newTab: ComponentInternalInstance, newIndex: number, oldTab?: ComponentInternalInstance, oldIndex?: number) => void;
};
declare interface TabEventPublic extends UpdateModelValueEventPublic<number> {
    /**
     * Fired when active tab is changed.
     */
    onChange?: (newTab: ComponentInternalInstance, newIndex: number, oldTab?: ComponentInternalInstance, oldIndex?: number) => void;
    /**
     * Fired when active tab is changed.
     */
    '@change'?: (newTab: ComponentInternalInstance, newIndex: number, oldTab?: ComponentInternalInstance, oldIndex?: number) => void;
}

interface ITabsProvider {
    tabItems: ShallowReactive<ComponentInternalInstance[]>;
    tabPanels: ShallowReactive<ComponentInternalInstance[]>;
    readonly activeTab: ComponentInternalInstance | undefined;
    readonly activeTabIndex: number | undefined;
    readonly alignment: TAlignment;
    readonly contentTransition: string;
    readonly iconPosition: TPlacementPosition;
    readonly iconSize: number;
    readonly tabClass: string | string[] | undefined;
    readonly tabPosition: TPlacementPosition | undefined;
    readonly variant: TTabsVariant | string | undefined;
    /**
     * Register a TabItem.
     *
     * @param {ComponentInternalInstance} item The TabItem item
     * @returns {number} The TabItem index position
     */
    registerTabItem(item: ComponentInternalInstance): number;
    /**
     * Register a TabPanel.
     *
     * @param {ComponentInternalInstance} item The TabPanel item
     * @returns {number} The TabPanel index position
     */
    registerTabPanel(item: ComponentInternalInstance): number;
    /**
     * Unregister all the TabItems and TabPanels.
     *
     * @returns {void}
     */
    unRegisterAll(): void;
    /**
     * Unregister the TabItem and TabPanel.
     *
     * @param {string|number} key The tab index position or tab ID.
     * @returns {void}
     */
    unRegisterTab(key: Numberish): void;
    /**
     * Set the active tab.
     *
     * @param {string|number} key The tab index position or tab ID.
     * @returns {void}
     */
    setActiveTab(key: MaybeNumberish): void;
}

declare const BsTabsPlugin: ObjectPlugin;

declare type TTooltipOptionProps = {
    /**
     * HTML element ID, {@link Element} instance or component instance that can trigger
     * the appearance of this tooltip.
     */
    activator?: string | Element | ComponentPublicInstance;
    /**
     * Hide tooltip arrow or not.
     */
    arrowOff?: boolean;
    /**
     * This tooltip content.
     */
    content?: string;
    /**
     * Disable this tooltip and prevent it from appearing.
     */
    disabled?: boolean;
    /**
     * Value monitored by `v-model` to show or hide this tooltip programmatically.
     */
    show?: boolean;
    /**
     * This tooltip display placement.
     */
    placement?: TPlacementPosition;
    /**
     * This tooltip display width.
     */
    width?: Numberish;
    /**
     * This tooltip maximum display width.
     */
    maxWidth?: Numberish;
    /**
     * This tooltip inline-css 'z-index'.
     */
    zIndex?: Numberish;
};
declare type TBsTooltip = ComponentObjectPropsOptions<TTooltipOptionProps>;

declare const _default$e: DefineComponent<TBsTooltip, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, TooltipEventProps, string, PublicProps, Readonly<TTooltipOptionProps> & Readonly<TooltipEventPublic>, ExtractDefaultPropTypes<TBsTooltip>, SlotsType<TooltipSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type TooltipEventProps = {
    /**
     * Fired when this Tooltip state is updated.
     */
    'update:show'?: (value: boolean) => void;
};
declare interface TooltipEventPublic {
    /**
     * Fired when this Tooltip state is updated.
     */
    'onUpdate:show'?: (value: boolean) => void;
    /**
     * Fired when this Tooltip state is updated.
     */
    '@update:show'?: (value: boolean) => void;
}
declare interface TooltipSlots extends VoidDefaultSlots {
    /**
     * Additional slot used to place the Tooltip's custom content.
     */
    content?: () => VNode[] | VNode;
}

declare const BsTooltipPlugin: ObjectPlugin;

declare type TProgressControlMode = 'determinate' | 'indeterminate' | 'buffer';
declare type TProgressControlVariant = 'spinner' | 'bar';
declare type TProgressBarLabelPosition = 'start' | 'end' | 'top' | 'bottom';
declare type TProgressBarValuePosition = 'start' | 'end' | 'top' | 'bottom' | 'inside';
declare type TTextLabelAlignment = 'start' | 'end' | 'center';
declare type TMaskLoaderVariant = 'linear' | 'linear-alt' | 'progress' | 'spinner' | 'grow';
declare type TMaskLoaderOptionProps = {
    /**
     * Sets the inline css-style `position` property. If `true` then the inline
     * css-style `position` property is set to `fixed`.
     */
    fixedPosition?: boolean;
    /**
     * Mask loader state, show or hide.
     */
    show?: boolean;
    /**
     * Backdrop overlay opacity value.
     */
    overlayOpacity?: Numberish;
    /**
     * Backdrop overlay color.
     * Must be a valid CSS color formatted string.
     */
    overlayColor?: string;
    /**
     * Mask loader spinner color.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `default`.
     */
    spinnerColor?: TContextColor | string;
    /**
     * Mask loader spinner diameter.
     */
    spinnerDiameter?: Numberish;
    /**
     * Mask loader spinner thickness.
     */
    spinnerThickness?: Numberish;
    /**
     * Mask loader type variant.
     */
    type?: TMaskLoaderVariant;
    /**
     * The animation transition to be used when displaying the mask loader.
     */
    transition?: string;
    /**
     * Sets the css style `z-index` value.
     */
    zIndex?: Numberish;
};
declare type TSpinLoaderOptionProps = {
    /**
     * HTML tag name to be used to create this component.
     */
    tag?: 'span' | 'div';
    /**
     * Component size. Numbers get converted to pixel. Any other value must
     * include the units (such as `px`, `em`, or `rem`).
     */
    size?: Numberish;
    /**
     * Component border thickness. Numbers get converted to pixel.
     * Any other value must include the units (such as `px`, `em`, or `rem`).
     */
    thickness?: Numberish;
};
declare type TProgressOptionProps = {
    /**
     * ProgressBar buffer length.
     */
    buffer?: Numberish;
    /**
     * The component color appearance.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `default`.
     */
    color?: TContextColor | string;
    /**
     * Spinner diameter value.
     */
    diameter?: Numberish;
    /**
     * ProgressBar thickness.
     */
    height?: Numberish;
    /**
     * Spinner thickness.
     */
    stroke?: Numberish;
    /**
     * The value monitored by `v-model` to control the progress value.
     */
    modelValue?: number;
    /**
     * ProgressControl mode, valid values are: `determinate`, `indeterminate`, `buffer`.
     */
    mode?: TProgressControlMode;
    /**
     * ProgressControl type, valid values are: `spinner`, `bar`.
     */
    type?: TProgressControlVariant;
};
declare type TProgressBarOptionProps = {
    /**
     * The control bar color appearance.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `default`.
     */
    color?: TContextColor | string;
    /**
     * The ProgressBar thickness.
     */
    height?: Numberish;
    /**
     * Optional, control bar css classes.
     */
    innerCls?: string;
    /**
     * The ProgressBar text label.
     */
    label?: string;
    /**
     * The ProgressBar text label alignment.
     */
    labelAlignment?: TTextLabelAlignment;
    /**
     * The ProgressBar label position.
     */
    labelPosition?: TProgressBarLabelPosition;
    /**
     * The value monitored by `v-model` to control the progress bar value.
     */
    modelValue?: number;
    /**
     * Remove the rounded side border of the progress bar.
     */
    roundedOff?: boolean;
    /**
     * Create striped progress bar.
     */
    striped?: boolean;
    /**
     * Create animated stripe progress bar.
     */
    stripedAnimation?: boolean;
    /**
     * Display progress bar's text value.
     */
    showValue?: boolean;
    /**
     * Progress bar's text value position.
     */
    valuePosition?: TProgressBarValuePosition;
};
declare type TBsMaskLoader = ComponentObjectPropsOptions<TMaskLoaderOptionProps>;
declare type TBsSpinLoader = ComponentObjectPropsOptions<TSpinLoaderOptionProps>;
declare type TBsProgress = ComponentObjectPropsOptions<TProgressOptionProps>;
declare type TBsProgressBar = ComponentObjectPropsOptions<TProgressBarOptionProps>;

declare const _default$d: DefineComponent<TBsMaskLoader, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TMaskLoaderOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsMaskLoader>, {}, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$c: DefineComponent<TBsProgress, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TProgressOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsProgress>, {}, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$b: DefineComponent<TBsProgressBar, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TProgressBarOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsProgressBar>, {}, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$a: DefineComponent<TBsSpinLoader, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TSpinLoaderOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsSpinLoader>, {}, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const BsProgressPlugin: ObjectPlugin;

declare type TCheckboxPosition = 'left' | 'right';
declare type TDataListSchema = {
    displayField: string;
    valueField: string;
    imageField?: string;
    cascadeField?: string;
    disableField?: string;
};
declare type TDataSource = {
    proxy: IBsStore | IArrayStore;
    /**
     * The data schema which will be used to recognize and render
     * the data items on the Listbox container.
     */
    schema?: TDataListSchema;
};
declare type TListboxBaseProps = {
    /**
     * The value monitored by `v-model` to maintain this field value.
     */
    modelValue?: Numberish | Numberish[] | null;
    /**
     * Enable/disable multi selection.
     */
    multiple?: boolean;
    /**
     * Sets the data source configuration.
     */
    dataSource?: TDataSource;
    /**
     * Sets the **no data message** when the Listbox is empty.
     */
    emptyDataMessage?: string;
    /**
     * Sets the **not found message** when searching returns no result.
     */
    notFoundMessage?: string;
    /**
     * Minimum characters to check before start filtering the Listbox items.
     */
    minSearchChars?: Numberish;
    /**
     * Minimum number of items to activate the search box.
     */
    minSearchLength?: Numberish;
    /**
     * Sets this component's Listbox checkbox color.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `default`.
     */
    checkboxColor?: TContextColor | string;
    /**
     * Sets this component's Listbox checkbox position. Valid values are: `left`, `right`.
     */
    checkboxPosition?: TCheckboxPosition;
    /**
     * Show or hide the Listbox item separator.
     */
    itemSeparator?: boolean;
    /**
     * Set to `TRUE` when Listbox has dark background color.
     */
    itemSeparatorDark?: boolean;
    /**
     * Define the image size for each Listbox items when `show-image` is enabled.
     */
    imageSize?: Numberish;
    /**
     * Show or hide image if Listbox item's object contains `image` property.
     */
    showImage?: boolean;
    /**
     * Display image with **rounded** shape for each item that has image property
     */
    roundedImage?: boolean;
    /**
     * Display image with **circle** shape for each item that has image property
     */
    circleImage?: boolean;
};
declare type TListboxOptionProps = TListboxBaseProps & {
    /**
     * Autoload data from the configured `dataSource`, default is `true`.
     */
    autoload?: boolean;
    /**
     * Hide the Listbox container borders.
     */
    borderless?: boolean;
    /**
     * Apply custom color scheme to this Listbox component.
     *
     * @deprecated
     * Use unified global CSS variable instead.
     */
    color?: string;
    /**
     * This component's state.
     */
    disabled?: boolean;
    /**
     * This component's state.
     */
    readonly?: boolean;
    /**
     * Sets the Listbox container maximum height.
     */
    maxHeight?: Numberish;
    /**
     * Text label on the search box.
     */
    searchLabel?: string;
    /**
     * Text to search on the data items.
     */
    searchText?: string;
    /**
     * Use checkbox for multi selection.
     */
    useCheckbox?: boolean;
};
declare type TComboboxOptionProps = TInputFieldProps & TListboxBaseProps & {
    /**
     * Autofocus field when this component is mounted.
     */
    autofocus?: boolean;
    /**
     * Sets the field placeholder.
     */
    placeholder?: string;
    /**
     * Sets the cascading combobox parent value.
     */
    parentValue?: Numberish;
    /**
     * Sets the Listbox background color.
     *
     * @deprecated
     * Use unified global CSS variables instead.
     */
    listboxColor?: string;
    /**
     * Sets this component's Listbox container maximum height.
     */
    listboxMaxHeight?: Numberish;
    /**
     * Sets this component's Listbox container minimum width.
     */
    listboxMinWidth?: Numberish;
    /**
     * Sets the text label on the searchbox.
     */
    listboxSearchLabel?: string;
    /**
     * Enable/disable **Chip** selection style for the selected items.
     */
    chipEnabled?: boolean;
    /**
     * The default Chips color to apply.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`, `default`.
     */
    chipColor?: TExtendedContextColor | string;
    /**
     * Render the Chips with rounded-pill style.
     */
    chipPill?: boolean;
    /**
     * Render the Chips with outlined style.
     */
    chipOutlined?: boolean;
    /**
     * Show the Listbox on `mouseenter` event.
     */
    openOnHover?: boolean;
    /**
     * Sets transition animation when showing the Listbox container.
     */
    transition?: string;
};
declare type TBsListbox = ComponentObjectPropsOptions<TListboxOptionProps>;
declare type TBsCombobox = ComponentObjectPropsOptions<TComboboxOptionProps>;

declare const _default$9: DefineComponent<TBsCombobox, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ComboboxEventProps, string, PublicProps, Readonly<TComboboxOptionProps> & Readonly<ComboboxEventPublic>, ExtractDefaultPropTypes<TBsCombobox>, SlotsType<ComboboxSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare interface ComboboxSlots extends FieldSlots {
    /**
     * Additional slot used to customize the listbox items appearance.
     */
    'option-item'?: (arg: {
        item: TBsModel;
        index: number;
    }) => VNode[] | VNode;
    /**
     * Additional slot used to place custom message when listbox is empty.
     */
    'empty-data-msg'?: () => VNode[] | VNode;
    /**
     * Additional slot used to place custom message when filtering listbox items returns no result.
     */
    'not-found-msg'?: () => VNode[] | VNode;
}
declare type ComboboxEventProps = UpdateModelValueEventProps<Numberish | Numberish[] | undefined> & {
    /**
     * Fired when this component's value is being cleared.
     */
    clear?: VoidFunction;
    /**
     * Fired when the Popover is show.
     */
    open?: VoidFunction;
    /**
     * Fired when an item is selected.
     */
    select?: (item: TBsModel) => void;
    /**
     * Fired when an item is deselected.
     */
    deselect?: (item: TBsModel) => void;
    /**
     * Fired when the data has been fetched.
     */
    'data-bind'?: (data: TBsModel[]) => void;
    /**
     * Fired when error loading data items.
     */
    'data-error'?: (error: unknown) => void;
    /**
     * Fired when this component's data items is filtered.
     */
    'data-filter'?: (data: TBsModel[]) => void;
    /**
     * Fired when this component's selected value is updated.
     */
    'update:selected-value'?: (selected: TBsModel[]) => void;
};
declare interface ComboboxEventPublic extends UpdateModelValueEventPublic<Numberish | Numberish[] | undefined> {
    /**
     * Fired when this component's value is being cleared.
     */
    onClear?: VoidFunction;
    /**
     * Fired when the Popover is show.
     */
    onOpen?: VoidFunction;
    /**
     * Fired when an item is selected.
     */
    onSelect?: (item: TBsModel) => void;
    /**
     * Fired when an item is deselected.
     */
    onDeselect?: (item: TBsModel) => void;
    /**
     * Fired when the data has been fetched.
     */
    onDataBind?: (data: TBsModel[]) => void;
    /**
     * Fired when error loading data items.
     */
    onDataError?: (error: unknown) => void;
    /**
     * Fired when this component's data items is filtered.
     */
    onDataFilter?: (data: TBsModel[]) => void;
    /**
     * Fired when this component's selected value is updated.
     */
    'onUpdate:selectedValue'?: (selected: TBsModel[]) => void;
    /**
     * Fired when this component's value is being cleared.
     */
    '@clear'?: VoidFunction;
    /**
     * Fired when the Popover is show.
     */
    '@open'?: VoidFunction;
    /**
     * Fired when an item is selected.
     */
    '@select'?: (item: TBsModel) => void;
    /**
     * Fired when an item is deselected.
     */
    '@deselect'?: (item: TBsModel) => void;
    /**
     * Fired when the data has been fetched.
     */
    '@data-bind'?: (data: TBsModel[]) => void;
    /**
     * Fired when error loading data items.
     */
    '@data-error'?: (error: unknown) => void;
    /**
     * Fired when this component's data items is filtered.
     */
    '@data-filter'?: (data: TBsModel[]) => void;
    /**
     * Fired when this component's selected value is updated.
     */
    '@update:selected-value'?: (selected: TBsModel[]) => void;
}

declare const _default$8: DefineComponent<TBsListbox, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ListboxEventProps, string, PublicProps, Readonly<TListboxOptionProps> & Readonly<ListboxEventPublic>, ExtractDefaultPropTypes<TBsListbox>, SlotsType<ListboxSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare interface ListboxSlots {
    /**
     * Additional slot used to customize the listbox items appearance.
     */
    'option-item'?: (arg: {
        item: TBsModel;
        index: number;
    }) => VNode[] | VNode;
    /**
     * Additional slot used to place custom message when listbox is empty.
     */
    'empty-data-msg'?: () => VNode[] | VNode;
    /**
     * Additional slot used to place custom message when filtering listbox items returns no result.
     */
    'not-found-msg'?: () => VNode[] | VNode;
}
declare type ListboxEventProps = UpdateModelValueEventProps<Numberish | Numberish[] | undefined> & {
    /**
     * Fired when an item is selected.
     */
    select?: (item: TBsModel) => void;
    /**
     * Fired when an item is deselected.
     */
    deselect?: (item: TBsModel) => void;
    /**
     * Fired when the data has been fetched.
     */
    'data-bind'?: (data: TBsModel[]) => void;
    /**
     * Fired when error loading data items.
     */
    'data-error'?: (error: unknown) => void;
    /**
     * Fired when the Listbox data items is filtered.
     */
    'data-filter'?: (data: TBsModel[]) => void;
    /**
     * Fired when the Listbox search value is updated.
     */
    'update:search-text'?: (search?: string) => void;
    /**
     * Fired when the Listbox selected value is updated.
     */
    'update:selected-value'?: (selected: TBsModel[]) => void;
};
declare interface ListboxEventPublic extends UpdateModelValueEventPublic<Numberish | Numberish[] | undefined> {
    /**
     * Fired when an item is selected.
     */
    onSelect?: (item: TBsModel) => void;
    /**
     * Fired when an item is deselected.
     */
    onDeselect?: (item: TBsModel) => void;
    /**
     * Fired when the data has been fetched.
     */
    onDataBind?: (data: TBsModel[]) => void;
    /**
     * Fired when error loading data items.
     */
    onDataError?: (error: unknown) => void;
    /**
     * Fired when the Listbox data items is filtered.
     */
    onDataFilter?: (data: TBsModel[]) => void;
    /**
     * Fired when the Listbox search value is updated.
     */
    'onUpdate:search-text'?: (search?: string) => void;
    /**
     * Fired when the Listbox selected value is updated.
     */
    'onUpdate:selectedValue'?: (selected: TBsModel[]) => void;
    /**
     * Fired when an item is selected.
     */
    '@select'?: (item: TBsModel) => void;
    /**
     * Fired when an item is deselected.
     */
    '@deselect'?: (item: TBsModel) => void;
    /**
     * Fired when the data has been fetched.
     */
    '@data-bind'?: (data: TBsModel[]) => void;
    /**
     * Fired when error loading data items.
     */
    '@data-error'?: (error: unknown) => void;
    /**
     * Fired when the Listbox data items is filtered.
     */
    '@data-filter'?: (data: TBsModel[]) => void;
    /**
     * Fired when the Listbox search value is updated.
     */
    '@update:search-text'?: (search?: string) => void;
    /**
     * Fired when the Listbox selected value is updated.
     */
    '@update:selected-value'?: (selected: TBsModel[]) => void;
}

declare const BsComboboxPlugin: ObjectPlugin;

declare type TColorPickerMode = 'HEX' | 'RGB' | 'HSL' | 'OKLCH';
declare type TColor = HSVA & RGBA;
declare type TColorPickerValue = {
    currentColor: TColor;
    hueSlider: number;
    alphaSlider: number;
    mode: TColorPickerMode;
    value: string | undefined;
};
/**
 * ColorPicker internal data structures.
 */
declare type TColorPickerData = {
    config: Reactive<TColorPickerValue>;
    colorRGB: Reactive<RGBA>;
    colorHSL: Reactive<HSLA>;
    colorOKLCH: Reactive<LCHA>;
    pickerEl: Ref<HTMLElement | null>;
    colorArea: Ref<HTMLElement | null>;
    colorAreaRect: DOMRect;
    colorMarker: Ref<HTMLElement | null>;
    colorPreview: Ref<HTMLElement | null>;
    hueSlider: Ref<HTMLElement | null>;
    hueSliderThumb: Ref<HTMLElement | null>;
    alphaSlider: Ref<HTMLElement | null>;
    alphaSliderThumb: Ref<HTMLElement | null>;
    canvasCtx?: CanvasRenderingContext2D | null;
};
declare type TColorPickerOptionProps = {
    /**
     * Display this ColorPicker as a popup dialog and calculate its display
     * position from the activator element.
     *
     * Leave it `undefined` to display persistent/inline ColorPicker.
     */
    activator?: Element | string;
    /**
     * This ColorPicker container background color.
     *
     * @deprecated
     * Use unified global CSS variable instead.
     */
    containerColor?: string;
    /**
     * Display ColorPicker at a position that covers the activator element.
     */
    cover?: boolean;
    /**
     * Hide alpha slider and alpha input field.
     */
    hideAlpha?: boolean;
    /**
     * Hide the input fields.
     */
    hideInputs?: boolean;
    /**
     * Hide toggle mode buttons.
     */
    hideModeButton?: boolean;
    /**
     * Render the toggle mode buttons with outlined style.
     */
    modeButtonOutlined?: boolean;
    /**
     * Render the toggle mode buttons with filled tonal style.
     */
    modeButtonTonal?: boolean;
    /**
     * Default the toggle mode button color style.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`,
     * `dark`, `default`.
     */
    modeButtonColor?: TButtonColor | string;
    /**
     * Color to apply to the active toggle mode button.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`,
     * `dark`, `default`.
     */
    modeButtonToggleColor?: TButtonColor | string;
    /**
     * Apply custom CSS style to the input field label.
     */
    inputLabelClass?: string | string[];
    /**
     * This ColorPicker popup state: `show` or `hide`.
     * Only works if activator element is defined.
     */
    open?: boolean;
    /**
     * This ColorPicker mode. Valid values: `HEX`, `RGB`, `HSL`, `OKLCH`.
     */
    mode?: TColorPickerMode;
    /**
     * This ColorPicker value that monitored by `v-model`.
     */
    modelValue?: string;
    /**
     * This ColorPicker display placement when property `activator` is defined.
     */
    placement?: TPopoverPosition;
    /**
     * Number of pixel to shift the ColorPicker display position from the activator element.
     */
    space?: Numberish;
    /**
     * Custom color swatches to display at the bottom ColorPicker.
     */
    swatches?: string[];
    /**
     * Sets the maximum height of the swatches section.
     */
    swatchesMaxHeight?: Numberish;
    /**
     * Transition animation when displaying the ColorPicker.
     * This animation is effected by `placement` property.
     */
    transition?: string;
};
declare type TBsColorPicker = ComponentObjectPropsOptions<TColorPickerOptionProps>;
declare interface BsColorPickerInstance extends ComponentPublicInstance {
    hex: () => string;
    rgba: () => RGBA;
    hsla: () => HSLA;
    oklch: () => LCHA;
}

declare const _default$7: DefineComponent<TBsColorPicker, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ColorPickerEventProps, string, PublicProps, Readonly<TColorPickerOptionProps> & Readonly<ColorPickerEventPublic>, ExtractDefaultPropTypes<TBsColorPicker>, {}, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type ColorPickerEventProps = UpdateModelValueEventProps<string> & UpdateOpenEventProps & {
    /**
     * Fired when this ColorPicker's mode is updated or changed.
     */
    'update:mode'?: (mode: TColorPickerMode) => void;
};
declare interface ColorPickerEventPublic extends UpdateModelValueEventPublic<string>, UpdateOpenEventPublic {
    /**
     * Fired when this ColorPicker's mode is updated or changed.
     */
    'OnUpdate:mode'?: (mode: TColorPickerMode) => void;
    /**
     * Fired when this ColorPicker's mode is updated or changed.
     */
    '@update:mode'?: (mode: TColorPickerMode) => void;
}

declare const BsColorPickerPlugin: ObjectPlugin;

declare type TDateTimePickerMode = 'date' | 'datetime' | 'year' | 'month' | 'time';
declare type TDatePickerOptionProps = {
    /**
     * Display this component in 100% width or occupy its parent element width.
     */
    fullWidth?: boolean;
    /**
     * Sets calendar `date`, `month`, `year` `time` and `navigation` button color.
     * Default is `secondary`.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`,
     * `dark`, `default`.
     */
    buttonColor?: TButtonColor | string;
    /**
     * Sets selected calendar `date`, `month`, `year` and `time` button color.
     * Default is interpolated from `headerColor`.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`,
     * `dark`, `default`.
     */
    selectedColor?: TButtonColor | string;
    /**
     * Optional, sets this component's container background color.
     *
     * @deprecated
     * Use `surfaceClass` instead.
     */
    surfaceColor?: string;
    /**
     * Optional, sets custom CSS class for component's background and text color.
     */
    surfaceClass?: string | string[];
    /**
     * Sets component's header panel background color. Default is `primary`.
     *
     * Custom CSS class can also be used as the value for this property.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `default`.
     */
    headerColor?: TContextColor | string;
    /**
     * Show or hide header panel.
     */
    headerPanel?: boolean;
    /**
     * Display this component in landscape orientation.
     */
    landscape?: boolean;
    /**
     * Define default locale to be used. Defaults is using browser's locale.
     */
    locale?: string;
    /**
     * Put this component in readonly state.
     */
    readonly?: boolean;
    /**
     * This component's value which is monitored by `v-model`.
     *
     * The initial value can be:
     * - From an ISO 8601 valid string.
     * - From a number of seconds since the epoch (meaning since 1 January 1970 00:00:00 UTC).
     */
    modelValue?: Numberish | Date | null;
    /**
     * This component's view mode, valid values are: `datetime`, `date`, `month`, `year`, `time`
     */
    mode?: TDateTimePickerMode;
    /**
     * @deprecated
     * Use `mode` property instead.
     */
    viewMode?: TDateTimePickerMode;
    /**
     * DatePicker's container width, default is 300px.
     */
    width?: Numberish;
};
declare type TDateTimeFieldOptionProps = TInputFieldProps & {
    /**
     * Autofocus field when this component is mounted.
     */
    autofocus?: boolean;
    /**
     * Sets the field placeholder.
     */
    placeholder?: string;
    /**
     * Optional, sets DatePicker's header panel background color. Default is `primary`.
     *
     * Custom CSS class can also be used as the value for this property.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `default`.
     */
    headerColor?: TContextColor | string;
    /**
     * Show or hide DatePicker's header panel.
     */
    headerPanel?: boolean;
    /**
     * Optional, sets custom CSS class for DatePicker's surface background and text color.
     */
    surfaceCls?: string | string[];
    /**
     * Display DatePicker component in landscape orientation.
     */
    landscapeMode?: boolean;
    /**
     * Define default locale to be used. Defaults is using browser's locale.
     */
    locale?: string;
    /**
     * This component's value which is monitored by `v-model`.
     *
     * The initial value can be:
     * - From an ISO 8601 valid string.
     * - From a number of seconds since the epoch (meaning since 1 January 1970 00:00:00 UTC).
     */
    modelValue?: Numberish | null;
    /**
     * The format string to display the datetime value.
     */
    displayFormat?: string;
    /**
     * The format string for the datetime output value and also format pattern to
     * parse the initial `modelValue` data.
     */
    valueFormat?: string;
    /**
     * Show the DatePicker on `mouseenter` event.
     */
    openOnHover?: boolean;
    /**
     * @deprecated
     * Use `pickerMode` property instead.
     */
    viewMode?: TDateTimePickerMode;
    /**
     * This component's DatePicker view mode,
     * valid values are: `datetime`, `date`, `month`, `year`, `time`
     */
    pickerMode?: TDateTimePickerMode;
    /**
     * Optional, sets custom CSS class for the DatePicker popover container.
     */
    pickerCls?: string | string[];
    /**
     * This DatePicker calendar date button and navigation button color. Default is `dark`.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`,
     * `dark`, `default`.
     */
    pickerButton?: TButtonColor | string;
    /**
     * Sets DatePicker selected calendar `date`, `month`, `year` and `time` button color.
     * Default is interpolated from `headerColor`.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`,
     * `dark`, `default`.
     */
    pickerSelectedColor?: TButtonColor | string;
    /**
     * Optional, sets DatePicker surface background color.
     *
     * @deprecated
     * Use `surfaceCls` property instead.
     */
    pickerColor?: string;
    /**
     * Sets the DatePicker popup display placement.
     */
    pickerPlacement?: TPopoverPosition;
    /**
     * DatePicker's container width, default is 300px.
     */
    pickerWidth?: Numberish;
    /**
     * Transition animation when showing the DateTime picker. This animation is
     * effected by `pickerPlacement` property.
     */
    pickerTransition?: string;
};
declare type TBsDatePicker = ComponentObjectPropsOptions<TDatePickerOptionProps>;
declare type TBsDateTimeField = ComponentObjectPropsOptions<TDateTimeFieldOptionProps>;

declare const _default$6: DefineComponent<TBsDatePicker, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, UpdateModelValueEventProps<string>, string, PublicProps, Readonly<TDatePickerOptionProps> & Readonly<UpdateModelValueEventPublic<string>>, ExtractDefaultPropTypes<TBsDatePicker>, {}, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare const _default$5: DefineComponent<TBsDateTimeField, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, DateTimeFieldEventProps, string, PublicProps, Readonly<TDateTimeFieldOptionProps> & Readonly<DateTimeFieldEventPublic>, ExtractDefaultPropTypes<TBsDateTimeField>, SlotsType<FieldSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type DateTimeFieldEventProps = FieldEventProps<string> & ClosableVoidEventProps & {
    /**
     * Fired when the DatePicker popup is open or showed.
     */
    open?: VoidFunction;
};
declare interface DateTimeFieldEventPublic extends FieldEventPublic<string>, ClosableVoidEventPublic {
    /**
     * Fired when the DatePicker popup is open or showed.
     */
    onOpen?: VoidFunction;
    /**
     * Fired when the DatePicker popup is open or showed.
     */
    '@open'?: VoidFunction;
}

declare const BsDatePickerPlugin: ObjectPlugin;

declare type TModalOptionProps = TPopupOptions & {
    /**
     * Show modal dialog in full page mode.
     */
    fullPage?: boolean;
    /**
     * Enable scrollable body.
     */
    scrollable?: boolean;
    /**
     * Modal dialog title.
     */
    title?: string;
    /**
     * Modal dialog width.
     */
    width?: Numberish;
    /**
     * Modal dialog maximum width.
     */
    maxWidth?: Numberish;
    /**
     * Additional CSS class name for dialog body container.
     */
    bodyClass?: string | string[];
    /**
     * Additional CSS class name for dialog footer container.
     */
    footerClass?: string | string[];
    /**
     * Additional CSS class name for dialog header container.
     */
    headerClass?: string | string[];
    /**
     * Transition animation when showing the dialog.
     * Valid values are: 'slide-top', 'slide-bottom', 'slide-left', 'slide-right', 'fade', 'scale'.
     */
    transition?: string;
};
declare type SourceType = 'image' | 'video' | 'youtube';
declare type TLightboxSource = {
    /**
     * Image, video or YouTube source url.
     */
    sourceUrl: string;
    /**
     * The source content type.
     * Valid value are: `image`, `video`, `youtube`.
     */
    type: SourceType | string;
    /**
     * Image thumbnail for the source url.
     */
    thumbnail: string;
    /**
     * Title to display.
     */
    title: string;
    /**
     * Additional CSS class to append to the viewer element when this item is active.
     */
    cssClass?: string | string[];
};
declare type TTransitionMode = 'in-out' | 'out-in';
declare type TLightboxButtonType = 'close' | 'delete' | 'download' | 'info' | 'menubar' | 'rotate' | 'zoom';
declare type TLightboxToolbarItems = {
    [K in TLightboxButtonType]?: boolean;
};
declare type TLightboxOptionProps = {
    /**
     * This Lightbox state: show or hide.
     */
    open?: boolean;
    /**
     * Close the Lightbox when ESC key is pressed.
     */
    escClose?: boolean;
    /**
     * Show backdrop overlay or not.
     */
    overlay?: boolean;
    /**
     * Close the Lightbox when the backdrop overlay is clicked.
     */
    overlayClickClose?: boolean;
    /**
     * Additional CSS class name for active image or video.
     */
    viewerClass?: string | string[];
    /**
     * Additional CSS styles for active image or video.
     */
    viewerStyles?: TRecord;
    /**
     * This component's source dataset.
     */
    items?: TLightboxSource[];
    /**
     * Show or hide indicator counter.
     */
    showCounter?: boolean;
    /**
     * Show or hide active item image title.
     */
    showItemTitle?: boolean;
    /**
     * Show or hide image thumbnails.
     */
    showThumbnail?: boolean;
    /**
     * Show or hide toolbar buttons.
     */
    showToolbar?: boolean;
    /**
     * Show or hide navigation controls.
     */
    showNavControl?: boolean;
    /**
     * Default image thumbnails height.
     */
    thumbnailHeight?: Numberish;
    /**
     * Configure the toolbar buttons.
     */
    toolbar?: TLightboxToolbarItems;
    /**
     * Transition animation name when showing the active image.
     * Available transitions are: `fade`, `scale`, `slide-fade`, `slide-fade-reverse`,
     * `slide-bottom-top`, `slide-top-bottom`, `slide-left-right`, `slide-right-left`.
     */
    transition?: string;
    /**
     * Controls the timing sequence of leaving/entering transitions.
     * Available modes are: `out-in` and `in-out`.
     */
    transitionMode?: TTransitionMode;
    /**
     * Insert inline CSS style `z-index` to control the component positioning on the HTML layers.
     */
    zIndex?: Numberish;
};
declare type TBsModal = ComponentObjectPropsOptions<TModalOptionProps>;
declare type TBsLightbox = ComponentObjectPropsOptions<TLightboxOptionProps>;
declare interface BsLightboxInstance extends ComponentPublicInstance {
    openAt(index: number): void;
    setActive(index: number): void;
    nextSlide(): void;
    prevSlide(): void;
}

declare const _default$4: DefineComponent<TBsLightbox, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, LightboxEventProps, string, PublicProps, Readonly<TLightboxOptionProps> & Readonly<LightboxEventPublic>, ExtractDefaultPropTypes<TBsLightbox>, SlotsType<LightboxSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare interface LightboxSlots {
    /**
     * The default slot used to place the dropdown-menu content.
     */
    menubar?: () => VNode[];
}
declare type LightboxEventProps = ClosableEventProps & UpdateOpenEventProps & {
    change?: (value: TLightboxSource, index: number) => void;
    'exec-delete'?: (target: TLightboxSource) => void;
    'exec-download'?: (target: TLightboxSource) => void;
    'exec-info'?: (target: TLightboxSource) => void;
    'exec-rotate-left'?: (target: TLightboxSource, rotate: number) => void;
    'exec-rotate-right'?: (target: TLightboxSource, rotate: number) => void;
    'exec-zoomin'?: (target: TLightboxSource, zoom: number) => void;
    'exec-zoomout'?: (target: TLightboxSource, zoom: number) => void;
};
declare interface LightboxEventPublic extends ClosableEventPublic, UpdateOpenEventPublic {
    onChange?: (value: TLightboxSource, index: number) => void;
    onExecDelete?: (target: TLightboxSource) => void;
    onExecDownload?: (target: TLightboxSource) => void;
    onExecInfo?: (target: TLightboxSource) => void;
    onExecRotateLeft?: (target: TLightboxSource, rotate: number) => void;
    onExecRotateRight?: (target: TLightboxSource, rotate: number) => void;
    onExecZoomin?: (target: TLightboxSource, zoom: number) => void;
    onExecZoomout?: (target: TLightboxSource, zoom: number) => void;
    '@change'?: (value: TLightboxSource, index: number) => void;
    '@exec-delete'?: (target: TLightboxSource) => void;
    '@exec-download'?: (target: TLightboxSource) => void;
    '@exec-info'?: (target: TLightboxSource) => void;
    '@exec-rotate-left'?: (target: TLightboxSource, rotate: number) => void;
    '@exec-rotate-right'?: (target: TLightboxSource, rotate: number) => void;
    '@exec-zoomin'?: (target: TLightboxSource, zoom: number) => void;
    '@exec-zoomout'?: (target: TLightboxSource, zoom: number) => void;
}

declare const _default$3: DefineComponent<TBsModal, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ModalEventProps, string, PublicProps, Readonly<TModalOptionProps> & Readonly<ModalEventPublic>, ExtractDefaultPropTypes<TBsModal>, SlotsType<ModalSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare interface ModalSlots extends VoidDefaultSlots {
    /**
     * Additional slot used to place the modal dialog header content.
     */
    header?: () => VNode[] | VNode;
    /**
     * Additional slot used to place the modal dialog footer content.
     */
    footer?: () => VNode[] | VNode;
}
declare type ModalEventProps = ClosableEventProps & UpdateOpenEventProps;
declare interface ModalEventPublic extends ClosableEventPublic, UpdateOpenEventPublic {
}

declare const BsModalPlugin: ObjectPlugin;

declare const _default$2: vue.DefineComponent<{}, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
    [key: string]: any;
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;

declare const BsNotificationPlugin: ObjectPlugin;

declare type TBreadcrumb = {
    /**
     * This breadcrumb item label.
     */
    label: string;
    /**
     * Properties of `<RouterLink>` component when using [vue-router](https://router.vuejs.org/).
     */
    location?: RouterLinkProps;
    /**
     * Absolute or relative URL if not using [vue-router](https://router.vuejs.org/).
     */
    href?: string;
    /**
     * Shortcut to create properties of `<RouterLink>` component by using the route's path only
     * when using [vue-router](https://router.vuejs.org/).
     */
    path?: string;
    /**
     * Shortcut to create properties of `<RouterLink>` component by using the route's name only
     * when using [vue-router](https://router.vuejs.org/).
     */
    pathName?: string;
    /**
     * The breadcrumb item's handler that will handle the `onClick` event.
     *
     * `handler`, `location`, `pathName`, `path` and `href` properties can't be mixed together.
     * If all or some of the properties is defined, then `handler` will take priority.
     *
     * The priorities are sorted as follows:
     * 1. `handler` (highest priority),
     * 2. `location`,
     * 3. `pathName`,
     * 4. `path`,
     * 5. `href` (lowest priority).
     */
    handler?: VoidFunction;
};
declare type TBreadcrumbOptionProps = {
    /**
     * The data-source to build the breadcrumbs.
     */
    items: TBreadcrumb[];
    /**
     * Prepend an icon before the first breadcrumb item label.
     *
     * Use android's icon name with suffix: `_outlined`, `_rounded`, `_sharp`, `_filled`,
     * `_outlined_filled`, `_rounded_filled`, or `_sharp_filled`. Suffix `_filled`
     * and `_outlined_filled` will result the same icon style.
     *
     * @see [Google Material Symbol](https://fonts.google.com/icons?icon.set=Material+Symbols) for details.
     */
    prependIcon?: string;
    /**
     * The size of `prependIcon` to create.
     */
    iconSize?: string | number;
    /**
     * Change the default breadcrumb item's separator.
     */
    separator?: string;
    /**
     * If `true`, the breadcrumb will be positioned using sticky-top.
     */
    sticky?: boolean;
    /**
     * Change the default HTML tag to render the breadcrumb container.
     * `<nav>` is the default HTML tag to create the breadcrumb container.
     */
    tag?: string;
};
declare type TBsBreadcrumb = ComponentObjectPropsOptions<TBreadcrumbOptionProps>;

declare const _default$1: DefineComponent<TBsBreadcrumb, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<TBreadcrumbOptionProps> & Readonly<{}>, ExtractDefaultPropTypes<TBsBreadcrumb>, SlotsType<BreadcrumbSlots>, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare interface BreadcrumbSlots {
    /**
     * Additional slot used to place custom icon of the Breadcrumb.
     */
    icon?: () => VNode[] | VNode;
}

declare const BsBreadcrumbPlugin: ObjectPlugin;

declare type TFileBag = {
    file?: File | null;
    image?: HTMLImageElement | null;
    name?: string | null;
    type?: string | null;
    size?: number | null;
    lastModified?: number | null;
};
declare type TCustomText = {
    dropImage?: string;
    selectImage?: string;
    changeImage?: string;
    unsupportedMessage?: string;
};
declare type TImageUploaderOptionProps = {
    /**
     * Accepted image file types, examples: image/jpg, image/png, *.jpg, *.png
     */
    acceptTypes: string;
    /**
     * Limit the size of uploaded file, in Megabytes (MB).
     */
    limit: Numberish;
    /**
     * The HTML input `id` attribute, if `undefined` then it will be auto-generated.
     */
    id?: string;
    /**
     * The html input `name` attribute.
     */
    name?: string;
    /**
     * Sets the color of Button element. Default is `primary`.
     *
     * Built-in colors are: `primary`, `secondary`, `success`, `warning`, `danger`, `info`, `light`,
     * `dark`, `default`.
     */
    buttonColor?: TButtonColor | string;
    /**
     * Sets the size of icon on the preview container in pixel. Default is `84` pixel.
     */
    iconSize?: Numberish;
    /**
     * Custom text for component elements.
     */
    customText?: TCustomText;
    /**
     * Display alert on error or not.
     */
    alertOnError?: boolean;
    /**
     * Whether to change image on `clicked` event or not. If `false` or `undefined`
     * then a button will appear to help in changing the image.
     */
    clickedChange?: boolean;
};
declare type TBsImageUploader = ComponentObjectPropsOptions<TImageUploaderOptionProps>;
declare type TUploadError = {
    size: number;
    type: string;
    name: string;
    message: string;
};
/**
 * `<BsImageUploader>` component instance when exposed by `ref` attribute.
 */
declare interface BsImageUploaderInstance extends ComponentPublicInstance {
    /**
     * Process upload the image that has already store within the component instance.
     *
     * @param url       Upload destination URL
     * @param property  The HTML input `name` attribute, default is from `props.name`.
     * @param data      Additional data to include when uploading the image
     *
     * @throws Error when failed processing the uploaded file.
     */
    upload(url: string, property?: string, data?: TRecord): AxiosPromise;
    fileBag: {
        /**
         * The picture's file that exists within the component instance and ready to upload.
         */
        file?: File | null;
        /**
         * The name of the file. The path is stripped off, for security reason.
         *
         * @see [File](https://developer.mozilla.org/en-US/docs/Web/API/File) for more details.
         */
        filename?: string | null;
        /**
         * The size of the file, in bytes.
         *
         * @see [File](https://developer.mozilla.org/en-US/docs/Web/API/File) for more details.
         */
        filesize?: number | null;
        /**
         * The MIME type of the file.
         *
         * @see [File](https://developer.mozilla.org/en-US/docs/Web/API/File) for more details.
         */
        filetype?: string | null;
    };
}

declare const _default: DefineComponent<TBsImageUploader, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, ImageUploaderEventProps, string, PublicProps, Readonly<TImageUploaderOptionProps> & Readonly<ImageUploaderEventPublic>, ExtractDefaultPropTypes<TBsImageUploader>, {}, {}, {}, string, ComponentProvideOptions, false, TRecord, never>;

declare type ImageUploaderEventProps = {
    /**
     * Fired when the image on this component is changed.
     */
    change?: (value: File) => void;
    /**
     * Fired when the image on this component is cleared or removed.
     */
    clear?: () => void;
    /**
     * Fired when error is occurred while changing the image.
     */
    error?: (error: TUploadError) => void;
};
declare interface ImageUploaderEventPublic {
    /**
     * Fired when the image on this component is changed.
     */
    onChange?: (value: File) => void;
    /**
     * Fired when the image on this component is cleared or removed.
     */
    onClear?: () => void;
    /**
     * Fired when error is occurred while changing the image
     */
    onError?: (error: TUploadError) => void;
    /**
     * Fired when the image on this component is changed.
     */
    '@change'?: (value: File) => void;
    /**
     * Fired when the image on this component is cleared or removed.
     */
    '@clear'?: () => void;
    /**
     * Fired when error is occurred while changing the image
     */
    '@error'?: (error: TUploadError) => void;
}

declare const BsUploaderPlugin: ObjectPlugin;

declare function createVueMdb(rootComponent: Component): App;

export { AbstractStore, AxiosPlugin, _default$F as BsAlert, BsAlertPlugin, BsAnimationPlugin, _default$X as BsApp, _default$U as BsAppbar, _default$T as BsAppbarItems, BsAppbarPlugin, _default$S as BsAppbarTitle, BsArrayStore, _default$K as BsAvatar, BsAvatarPlugin, _default$E as BsBadge, BsBadgePlugin, BsBasicCmpPlugin, _default$1 as BsBreadcrumb, BsBreadcrumbPlugin, _default$J as BsButton, BsButtonPlugin, _default$Q as BsCard, _default$P as BsCardBody, _default$O as BsCardContent, _default$N as BsCardFooter, _default$M as BsCardHeader, _default$L as BsCardMedia, BsCardPlugin, _default$w as BsCheckbox, _default$v as BsCheckboxGroup, BsCheckboxPlugin, _default$D as BsChip, _default$B as BsChipField, _default$C as BsChipGroup, BsChipPlugin, _default$I as BsCloseButton, _default$7 as BsColorPicker, BsColorPickerPlugin, _default$9 as BsCombobox, BsComboboxPlugin, _default$W as BsContainer, BsContainerPlugin, _default$V as BsContent, _default$6 as BsDatePicker, BsDatePickerPlugin, _default$5 as BsDateTimeField, _default$$ as BsDivider, BsDrawerPlugin, _default$h as BsDropdownMenu, _default$17 as BsExpandTransition, BsFieldPlugin, _default$14 as BsFontawesomeIcon, _default$13 as BsIcon, BsIconPlugin, _default$_ as BsImageHolder, _default as BsImageUploader, _default$4 as BsLightbox, _default$r as BsListNav, _default$q as BsListNavItem, _default$p as BsListTile, _default$o as BsListTileAction, _default$n as BsListTileContent, _default$m as BsListTileLeading, _default$l as BsListTileSubtitle, _default$k as BsListTileTitle, _default$j as BsListView, BsListViewPlugin, _default$8 as BsListbox, _default$d as BsMaskLoader, BsMenuPlugin, _default$3 as BsModal, BsModalPlugin, BsModel, _default$2 as BsNotification, BsNotificationPlugin, _default$A as BsNumericField, _default$16 as BsOverlay, _default$i as BsPopover, BsPopoverPlugin, _default$c as BsProgress, _default$b as BsProgressBar, BsProgressPlugin, _default$u as BsRadio, _default$t as BsRadioGroup, BsRadioPlugin, _default$15 as BsRipple, _default$z as BsSearchField, _default$R as BsSideDrawer, _default$Z as BsSpacer, _default$a as BsSpinLoader, _default$12 as BsSpinnerIcon, BsStore, _default$Y as BsSubheader, _default$11 as BsSvgIcon, _default$s as BsSwitch, BsSwitchPlugin, _default$g as BsTab, _default$f as BsTabs, BsTabsPlugin, _default$y as BsTextArea, _default$x as BsTextField, _default$H as BsToggleButton, _default$G as BsToggleField, _default$10 as BsToggleIcon, _default$e as BsTooltip, BsTooltipPlugin, BsUploaderPlugin, CacheManager, ClickOutside, ColorUtils as Color, EventListener$1 as EventListener, Helper, NotificationProvider, PopupManager, Resize, RestProxyAdapter, Scroll, StringHelper, Touch, createVueMdb, spinnerSvgData, useAddResizeListener, useAxiosPlugin, useBreakpointMax, useBreakpointMin, useCurrentRoute, useGenerateId, useHttpService, useMergeClass, useMobileDevice, useRemoveResizeListener, useRenderSVG, useRenderSlot, useRenderTransition, useVueMdbNotification, useVueMdbService, useWrapSlot, useWrapSlotDefault, useWrapSlotWithCondition };
export type { BsColorPickerInstance, BsImageUploaderInstance, BsLightboxInstance, BsListNavInstance, BsListNavItemInstance, BsListTileInstance, CSRFConfig, DataModel, DataStoreConfig, DataStoreState, EventListenerBinding, EventListenerTarget, FilterLogic, FilterOperator, FilterOptions, HtmlTagName, HttpMethod, IArrayStore, IBindingElement, IBsStore, ICacheItem, ICacheManager, IEventListenerResult, IHTMLElement, IHttpService, IListViewProvider, IMouseEvents, INotificationProvider, IRestAdapter, ITabsProvider, ListenerFn, LoadedCallbackFn, MaybeNumber, MaybeNumberish, MaybeString, MessageResponse, ModelConfig, ModelState, Numberish, ObjectBase, PlainModel, PromiseVoidFunction, QueryParameter, ResizeDirectiveBinding, ResponseCallbackFn, ResponseErrorCallbackFn, RestConfig, RestKey, RestMethodOptions, RestPropConfig, ScrollDirectiveBinding, SortDirection, SortOption, SourceType, TActionButtonPlacement, TActionButtonType, TAlertOptionProps, TAlertVariant, TAlignment, TAllowedIconProps, TAllowedImageProps, TAppContainerOptionProps, TAppbarOptionProps, TAppbarTitleOptionProps, TAvatarImageOptionProps, TAvatarOptionProps, TBadgeOptionProps, TBadgeType, TBadgeVariant, TBoolRecord, TBooleanRecord, TBreadcrumb, TBreadcrumbOptionProps, TBreakpoint, TBsAlert, TBsAppContainer, TBsAppbar, TBsAppbarTitle, TBsAvatar, TBsBadge, TBsBreadcrumb, TBsButton, TBsButtonInner, TBsCard, TBsCardBody, TBsCardContent, TBsCardFooter, TBsCardHeader, TBsCardMedia, TBsCheckbox, TBsCheckboxGroup, TBsChip, TBsChipField, TBsChipGroup, TBsCloseButton, TBsColorPicker, TBsCombobox, TBsContainer, TBsContent, TBsDatePicker, TBsDateTimeField, TBsDivider, TBsDropdownMenu, TBsFontawesomeIcon, TBsIcon, TBsImageHolder, TBsImageUploader, TBsLightbox, TBsListNav, TBsListNavItem, TBsListTile, TBsListTileAction, TBsListTileContent, TBsListTileLeading, TBsListTileSubtitle, TBsListTileTitle, TBsListView, TBsListbox, TBsMaskLoader, TBsModal, TBsModel, TBsNotificationBar, TBsNotificationItem, TBsNumericField, TBsOverlay, TBsPopover, TBsProgress, TBsProgressBar, TBsRadio, TBsRadioGroup, TBsRipple, TBsSearchField, TBsSideDrawer, TBsSpacer, TBsSpinLoader, TBsSpinnerIcon, TBsSubheader, TBsSvgIcon, TBsSwitch, TBsTabItem, TBsTabLabel, TBsTabPanel, TBsTabs, TBsTextArea, TBsTextField, TBsToggleButton, TBsToggleField, TBsToggleIcon, TBsTooltip, TButtonBaseProps, TButtonColor, TButtonInnerOptionProps, TButtonMode, TButtonOptionProps, TButtonSize, TButtonType, TCardContentOptionProps, TCardContentType, TCardMediaOptionProps, TCardOptionProps, TCheckboxGroupOptionProps, TCheckboxInputProps, TCheckboxOptionProps, TCheckboxPosition, TChipContainer, TChipFieldOptionProps, TChipGroupOptionProps, TChipOptionItem, TChipOptionProps, TChipSize, TChipValue, TClassList, TCloseButtonOptionProps, TColorPickerData, TColorPickerMode, TColorPickerOptionProps, TComboboxOptionProps, TComputedValidationResult, TContainerOptionProps, TContextColor, TCustomIconProps, TCustomText, TDataListSchema, TDataSource, TDatePickerOptionProps, TDateTimeFieldOptionProps, TDateTimePickerMode, TDirectiveBinding, TDividerOptionProps, TDropdownMenuOptionProps, TExtendedContextColor, TFieldComponent, TFieldType, TFileBag, TFontAwesomeVariant, TFontawesomeIconOptionProps, TIconBaseProps, TIconData, TIconFlip, TIconOptionProps, TIconPosition, TIconRotation, TIconVariant, TImageHolderOptionProps, TImageUploaderOptionProps, TInputBaseProps, TInputFieldProps, TInputGroupProps, TInputOptionItem, TInputTextProps, TLabelPosition, TLightboxButtonType, TLightboxOptionProps, TLightboxSource, TLightboxToolbarItems, TListItemBorder, TListNavItemOptionProps, TListNavOptionProps, TListTileActionOptionProps, TListTileContentOptionProps, TListTileLeadingOptionProps, TListTileOptionProps, TListTileTextOptionProps, TListViewOptionProps, TListboxBaseProps, TListboxOptionProps, TMaskLoaderOptionProps, TMaskLoaderVariant, TModalOptionProps, TNotificationBarOptionProps, TNotificationItemOptionProps, TNotificationOption, TNotificationPosition, TNotificationVariant, TNumericFieldOptionProps, TNumericOptions, TOrientation, TOverlayOptionProps, TPlacementPosition, TPopoverOptionProps, TPopoverPosition, TPopupItem, TPopupOptions, TProgressBarLabelPosition, TProgressBarOptionProps, TProgressBarValuePosition, TProgressControlMode, TProgressControlVariant, TProgressOptionProps, TRadioGroupOptionProps, TRadioInputProps, TRadioOptionProps, TRawCacheItem, TRecord, TRippleOptionProps, TRouterLinkProps, TRouterOptionProps, TSearchFieldOptionProps, TSideDrawer, TSideDrawerOptionProps, TSideDrawerPosition, TSideDrawerProps, TSizeOptionProps, TSizeProps, TSpaceAround, TSpacerOptionProps, TSpinLoaderOptionProps, TSpinnerIconOptionProps, TStringRecord, TSubheaderOptionProps, TSvgIconOptionProps, TSwitchOptionProps, TSwitchVariant, TTabItemOptionProps, TTabLabelOptionProps, TTabPanelOptionProps, TTabsBaseProps, TTabsOptionProps, TTabsVariant, TTagProp, TTextAreaOptionProps, TTextFieldOptionProps, TTextLabelAlignment, TToggleButtonOptionProps, TToggleFieldOptionProps, TToggleIconOptionProps, TTooltipOptionProps, TTransitionMode, TUploadError, TValidationProps, TValidator, TVueMdb, TVueMdbProps, TouchDirectiveBinding, TouchDirectiveEvent, TouchEventListener, TouchValueBinding, UrlMethod };