ano-ui
Version:
<p align="center"> <img src="https://github.com/ano-ui/ano-ui/raw/main/public/logo.svg" style="width:100px;" /> <h1 align="center">Ano-UI (WIP)</h1> <p align="center">An UniApp UI components with UnoCSS.</p> </p> <p align="center"> <a href="https://www.np
1,272 lines (1,206 loc) • 43.2 kB
text/typescript
import * as vue from 'vue';
import { PropType, StyleValue, ExtractPropTypes, SetupContext, InjectionKey, Ref, CSSProperties } from 'vue';
export * from '@ano-ui/preset';
import { ComponentResolver } from '@uni-helper/vite-plugin-uni-components';
type ClassType = string | object | Array<ClassType>;
declare const useCustomClassProp: {
type: PropType<ClassType>;
default: string;
};
declare const useCustomStyleProp: {
type: PropType<StyleValue>;
default: string;
};
type VariantType = 'solid' | 'outline' | 'ghost' | 'light' | 'text';
declare const useVariantProp: {
type: PropType<VariantType>;
default: string;
};
declare const sizeList: readonly ["mini", "small", "normal", "large"];
type SizeType = typeof sizeList[number];
declare const useSizeProp: {
type: PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
declare const typeList: readonly ["default", "primary", "success", "info", "warning", "danger"];
type Type = typeof typeList[number];
declare const useTypeProp: {
type: PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
declare const directionList: readonly ["vertical", "horizontal"];
type Direction = typeof directionList[number];
declare const useDirectionProp: {
type: PropType<"vertical" | "horizontal">;
validator: (value: string) => boolean;
default: string;
};
declare const positionList: readonly ["top", "bottom", "left", "right", "center"];
type PositionType = typeof positionList[number];
declare const PositionProp: {
type: PropType<"top" | "bottom" | "left" | "right" | "center">;
validator: (value: string) => boolean;
default: string;
};
type QuerySelectorMode = 'select' | 'selectAll';
type QuerySelectorResponse<M extends QuerySelectorMode, V = UniApp.NodeInfo> = M extends 'selectAll' ? V[] : V;
interface QuerySelectorNodeInfo<M extends QuerySelectorMode = 'select'> {
(selector: string): Promise<QuerySelectorResponse<M>>;
}
interface QuerySelectorNodeFields<M extends QuerySelectorMode = 'select'> {
(selector: string, fields?: UniApp.NodeField): Promise<QuerySelectorResponse<M>>;
}
interface QuerySelectorNode<M extends QuerySelectorMode = 'select'> {
(selector: string): Promise<QuerySelectorResponse<M, any>>;
}
declare function useQuerySelector(type: 'boundingClientRect'): QuerySelectorNodeInfo;
declare function useQuerySelector(type: 'context'): QuerySelectorNodeInfo;
declare function useQuerySelector(type: 'scrollOffset'): QuerySelectorNodeInfo;
declare function useQuerySelector(type: 'fields'): QuerySelectorNodeFields;
declare function useQuerySelector(type: 'node'): QuerySelectorNode;
declare function useQuerySelectorAll(type: 'boundingClientRect'): QuerySelectorNodeInfo<'selectAll'>;
declare function useQuerySelectorAll(type: 'context'): QuerySelectorNodeInfo<'selectAll'>;
declare function useQuerySelectorAll(type: 'scrollOffset'): QuerySelectorNodeInfo<'selectAll'>;
declare function useQuerySelectorAll(type: 'fields'): QuerySelectorNodeFields<'selectAll'>;
declare function useQuerySelectorAll(type: 'node'): QuerySelectorNode<'selectAll'>;
interface AvatarOption {
src?: string;
[key: string]: any;
}
declare const avatarGroupProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
max: NumberConstructor;
options: {
type: vue.PropType<AvatarOption[]>;
default: () => AvatarOption[];
};
};
declare const avatarGroupEmits: {
click: (evt: MouseEvent) => boolean;
};
type AvatarGroupProps = ExtractPropTypes<typeof avatarGroupProps>;
type AvatarGroupEmits = typeof avatarGroupEmits;
declare function useAvatarGroup(props: AvatarGroupProps, emit: SetupContext<AvatarGroupEmits>['emit']): {
className: vue.ComputedRef<never[]>;
spliceOptions: vue.ComputedRef<AvatarOption[]>;
reset: vue.ComputedRef<number>;
lt: vue.ComputedRef<boolean>;
clickHandler: (evt: MouseEvent) => void;
};
declare const useAvatarSizeProp: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
declare const avatarProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
size: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
src: StringConstructor;
fit: {
type: vue.PropType<"fill" | "contain" | "cover">;
default: "fill" | "contain" | "cover";
};
};
declare const avatarEmits: {
click: (evt: MouseEvent) => boolean;
};
type AvatarProps = ExtractPropTypes<typeof avatarProps>;
type AvatarEmits = typeof avatarEmits;
declare function useAvatar(props: AvatarProps, emit: SetupContext<AvatarEmits>['emit']): {
classes: vue.ComputedRef<string[]>;
clickHandler: (evt: MouseEvent) => void;
mode: vue.ComputedRef<string>;
};
declare const useButtonTypeProp: {
type: vue.PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
declare const useButtonSizeProp: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
declare const buttonProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
type: {
type: vue.PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
size: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
variant: {
type: vue.PropType<VariantType>;
default: string;
};
disabled: BooleanConstructor;
icon: StringConstructor;
openType: StringConstructor;
block: BooleanConstructor;
loading: BooleanConstructor;
};
declare const buttonEmits: {
click: (evt: MouseEvent) => boolean;
};
type ButtonProps = ExtractPropTypes<typeof buttonProps>;
type ButtonEmits = typeof buttonEmits;
declare function useButton(props: ButtonProps, emit: SetupContext<ButtonEmits>['emit']): {
disabled: vue.ComputedRef<boolean>;
classes: vue.ComputedRef<(string | false)[]>;
clickHandler: (evt: MouseEvent) => void;
};
declare const cellProps: {
customClass: {
type: PropType<ClassType>;
default: string;
};
customStyle: {
type: PropType<vue.StyleValue>;
default: string;
};
title: StringConstructor;
value: StringConstructor;
label: StringConstructor;
icon: StringConstructor;
arrow: {
type: PropType<boolean | "bottom" | "right">;
};
center: BooleanConstructor;
clickable: BooleanConstructor;
disabled: BooleanConstructor;
titleClass: {
type: PropType<ClassType>;
default: string;
};
titleStyle: {
type: PropType<vue.StyleValue>;
default: string;
};
valueClass: {
type: PropType<ClassType>;
default: string;
};
valueStyle: {
type: PropType<vue.StyleValue>;
default: string;
};
labelClass: {
type: PropType<ClassType>;
default: string;
};
labelStyle: {
type: PropType<vue.StyleValue>;
default: string;
};
};
declare const cellEmits: {
click: (evt: MouseEvent) => boolean;
};
type CellProps = ExtractPropTypes<typeof cellProps>;
type CellEmits = typeof cellEmits;
declare function useCell(props: CellProps, emit: SetupContext<CellEmits>['emit']): {
arrow: vue.ComputedRef<boolean | "bottom" | "right" | undefined>;
clickable: vue.ComputedRef<boolean>;
classes: vue.ComputedRef<string[]>;
clickHandler: (evt: MouseEvent) => void;
};
declare const popupProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
show: BooleanConstructor;
position: {
type: vue.PropType<"top" | "bottom" | "left" | "right" | "center">;
validator: (value: string) => boolean;
default: string;
};
duration: {
type: NumberConstructor;
default: number;
};
};
declare const popupEmits: {
"update:show": (value: boolean) => boolean;
open: () => boolean;
close: () => boolean;
opened: () => boolean;
closed: () => boolean;
};
type PopupProps = ExtractPropTypes<typeof popupProps>;
type PopupEmits = typeof popupEmits;
declare function usePopup(props: PopupProps, emit: SetupContext<PopupEmits>['emit']): {
showValue: vue.WritableComputedRef<boolean>;
classes: vue.ComputedRef<readonly [false | "left-50% top-50% translate--50%", false | "top-0 left-0 right-0", false | "bottom-0 left-0 right-0", false | "left-0 top-0 bottom-0", false | "right-0 top-0 bottom-0"]>;
};
type ToastPositionType = 'default' | 'top' | 'bottom';
type ToastType = 'success' | 'warning' | 'danger' | 'loading';
interface ToastOptions {
type?: ToastType;
position?: ToastPositionType;
message?: string;
duration?: number | false;
}
declare const toastProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
};
declare const toastEmits: {
close: () => boolean;
};
type ToastProps = ExtractPropTypes<typeof toastProps>;
type ToastEmits = typeof toastEmits;
interface ToastInst {
show: (options?: ToastOptions) => void;
close: () => void;
}
declare function useToast(props: ToastProps, emit: SetupContext<ToastEmits>['emit']): {
state: vue.Ref<ToastOptions | undefined>;
show: (options?: ToastOptions) => void;
close: () => void;
visible: vue.Ref<boolean>;
classes: vue.ComputedRef<readonly [false | "left-50% top-50% translate--50%", false | "left-50% top-20% translate--50%", false | "left-50% top-80% translate--50%"]>;
};
declare const useCheckboxTypeProp: {
type: vue.PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
declare const useCheckboxSizeProp: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
type CheckboxValueType = string | number | boolean;
declare const checkboxProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
type: {
type: vue.PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
size: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
variant: {
type: vue.PropType<VariantType>;
default: string;
};
disabled: BooleanConstructor;
modelValue: {
type: (StringConstructor | NumberConstructor | BooleanConstructor)[];
default: undefined;
};
value: {
type: (StringConstructor | NumberConstructor | BooleanConstructor)[];
default: string;
};
label: StringConstructor;
icon: StringConstructor;
customIcon: BooleanConstructor;
labelDisabled: BooleanConstructor;
};
declare const checkboxEmits: {
"update:modelValue": (val: CheckboxValueType) => boolean;
change: (val: CheckboxValueType) => boolean;
};
type CheckboxProps = ExtractPropTypes<typeof checkboxProps>;
type CheckboxEmits = typeof checkboxEmits;
declare const useCheckboxGroupDirectionProp: {
type: vue.PropType<"vertical" | "horizontal">;
validator: (value: string) => boolean;
default: string;
};
declare const checkboxGroupProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
modelValue: {
type: vue.PropType<CheckboxValueType[]>;
default: () => CheckboxValueType[];
};
size: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
direction: {
type: vue.PropType<"vertical" | "horizontal">;
validator: (value: string) => boolean;
default: string;
};
min: {
type: NumberConstructor;
default: number;
};
max: {
type: NumberConstructor;
default: number;
};
disabled: BooleanConstructor;
labelDisabled: BooleanConstructor;
};
type CheckboxGroupProps = ExtractPropTypes<typeof checkboxGroupProps>;
declare const checkboxGroupEmits: {
"update:modelValue": (val: CheckboxValueType[]) => boolean;
change: (val: CheckboxValueType[]) => boolean;
};
type CheckboxGroupEmits = typeof checkboxGroupEmits;
interface CheckboxGroupContext extends CheckboxGroupProps {
changeEvent: (val: CheckboxGroupProps['modelValue']) => void;
}
declare const checkboxGroupKey: InjectionKey<CheckboxGroupContext>;
declare const useRadioTypeProp: {
type: vue.PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
declare const useRadioSizeProp: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
type RadioValueType = string | number | boolean;
declare const radioProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
type: {
type: vue.PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
size: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
variant: {
type: vue.PropType<VariantType>;
default: string;
};
disabled: BooleanConstructor;
modelValue: {
type: (StringConstructor | NumberConstructor | BooleanConstructor)[];
default: string;
};
value: {
type: (StringConstructor | NumberConstructor | BooleanConstructor)[];
default: string;
};
label: StringConstructor;
icon: StringConstructor;
customIcon: BooleanConstructor;
};
declare const radioEmits: {
"update:modelValue": (val: RadioValueType) => boolean;
change: (val: RadioValueType) => boolean;
};
type RadioProps = ExtractPropTypes<typeof radioProps>;
type RadioEmits = typeof radioEmits;
declare function useRadio(props: RadioProps, emit?: SetupContext<RadioEmits>['emit']): {
radioGroup: RadioGroupContext | undefined;
isGroup: vue.ComputedRef<boolean>;
size: vue.ComputedRef<"mini" | "small" | "normal" | "large">;
disabled: vue.ComputedRef<boolean>;
modelValue: vue.ComputedRef<string | number | boolean>;
checked: vue.ComputedRef<string | number | boolean>;
toggle: (e: MouseEvent) => void;
};
declare const useRadioGroupDirectionProp: {
type: vue.PropType<"vertical" | "horizontal">;
validator: (value: string) => boolean;
default: string;
};
declare const radioGroupProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
modelValue: {
type: (StringConstructor | NumberConstructor | BooleanConstructor)[];
default: string;
};
size: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
direction: {
type: vue.PropType<"vertical" | "horizontal">;
validator: (value: string) => boolean;
default: string;
};
min: {
type: NumberConstructor;
default: number;
};
max: {
type: NumberConstructor;
default: number;
};
disabled: BooleanConstructor;
};
type RadioGroupProps = ExtractPropTypes<typeof radioGroupProps>;
declare const radioGroupEmits: {
"update:modelValue": (val: RadioValueType) => boolean;
change: (val: RadioValueType) => boolean;
};
type RadioGroupEmits = typeof radioGroupEmits;
interface RadioGroupContext extends RadioGroupProps {
changeEvent: (val: RadioGroupProps['modelValue']) => void;
}
declare const radioGroupKey: InjectionKey<RadioGroupContext>;
declare const cellGroupProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
divider: BooleanConstructor;
inset: BooleanConstructor;
arrow: BooleanConstructor;
center: BooleanConstructor;
clickable: BooleanConstructor;
title: StringConstructor;
};
type CellGroupProps = ExtractPropTypes<typeof cellGroupProps>;
interface CellGroupContext extends CellGroupProps {
}
declare const cellGroupKey: InjectionKey<CellGroupContext>;
type CollapseActiveName = string | number;
type CollapseModelValue = CollapseActiveName | Array<CollapseActiveName>;
interface CollapseContext {
activeNames: Ref<CollapseActiveName[]>;
handleItemClick: (name: CollapseActiveName) => void;
}
declare const collapseContextKey: InjectionKey<CollapseContext>;
declare function useCheckbox(props: CheckboxProps, emit?: SetupContext<CheckboxEmits>['emit']): {
checkboxGroup: CheckboxGroupContext | undefined;
isGroup: vue.ComputedRef<boolean>;
size: vue.ComputedRef<"mini" | "small" | "normal" | "large">;
min: vue.ComputedRef<number | undefined>;
max: vue.ComputedRef<number | undefined>;
disabled: vue.ComputedRef<boolean>;
modelValue: vue.ComputedRef<string | number | boolean | CheckboxValueType[] | undefined>;
checked: vue.ComputedRef<string | number | boolean | undefined>;
iconClickHandler: (e: MouseEvent) => void;
labelClickHandler: (e: MouseEvent) => void;
toggle: (e: MouseEvent) => void;
};
type FiledSize = 'mini' | 'small' | 'normal' | 'large';
type FieldType = 'text' | 'number' | 'digit' | 'password' | 'textarea';
type FieldLabelAlign = 'left' | 'right' | 'top' | 'center';
type FieldInputAlign = 'left' | 'right';
declare const useFieldTypeProp: {
type: PropType<FieldType>;
validator: (value: string) => boolean;
default: string;
};
declare const useFieldLabelAlignProp: {
type: PropType<FieldLabelAlign>;
validator: (value: string) => boolean;
default: string;
};
declare const useFieldInputAlignProp: {
type: PropType<FieldLabelAlign>;
validator: (value: string) => boolean;
default: string;
};
declare const fieldProps: {
customClass: {
type: PropType<ClassType>;
default: string;
};
customStyle: {
type: PropType<vue.StyleValue>;
default: string;
};
type: {
type: PropType<FieldType>;
validator: (value: string) => boolean;
default: string;
};
label: StringConstructor;
labelAlign: {
type: PropType<FieldLabelAlign>;
validator: (value: string) => boolean;
default: string;
};
inputAlign: {
type: PropType<FieldLabelAlign>;
validator: (value: string) => boolean;
default: string;
};
disabled: BooleanConstructor;
focus: BooleanConstructor;
icon: StringConstructor;
suffixIcon: StringConstructor;
showClear: BooleanConstructor;
placeholder: StringConstructor;
modelValue: StringConstructor;
maxlength: {
type: NumberConstructor;
default: number;
};
showWordLimit: BooleanConstructor;
};
declare const fieldEmits: {
"update:modelValue": (value: string) => boolean;
click: (evt: MouseEvent) => boolean;
focus: () => boolean;
blur: () => boolean;
input: (value: string) => boolean;
change: (value: string) => boolean;
clear: () => boolean;
};
type FieldProps = ExtractPropTypes<typeof fieldProps>;
type FieldEmits = typeof fieldEmits;
declare function useField(props: FieldProps, emit: SetupContext<FieldEmits>['emit']): {
disabled: vue.ComputedRef<boolean>;
modelValue: vue.ComputedRef<string>;
placeholderText: vue.ComputedRef<string>;
isClick: vue.Ref<boolean>;
showPasswordText: vue.Ref<boolean>;
focus: vue.ComputedRef<boolean>;
focusHandler: () => void;
clickHandler: (evt: MouseEvent) => void;
blurHandler: () => void;
inputHandler: (e: Event) => void;
clearHandler: () => void;
};
declare const useSwitchTypeProp: {
type: vue.PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
declare const useSwitchSizeProp: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
type SwitchValueType = string | number | boolean;
declare const switchProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
type: {
type: vue.PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
size: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
variant: {
type: vue.PropType<VariantType>;
default: string;
};
disabled: BooleanConstructor;
modelValue: {
type: (StringConstructor | NumberConstructor | BooleanConstructor)[];
default: boolean;
};
activeValue: {
type: (StringConstructor | NumberConstructor | BooleanConstructor)[];
default: boolean;
};
activeLabel: StringConstructor;
inactiveValue: {
type: (StringConstructor | NumberConstructor | BooleanConstructor)[];
default: boolean;
};
inactiveLabel: StringConstructor;
showIcon: {
type: BooleanConstructor;
default: true;
};
icon: StringConstructor;
loading: BooleanConstructor;
customIcon: BooleanConstructor;
};
declare const switchEmits: {
"update:modelValue": (val: SwitchValueType) => boolean;
change: (val: SwitchValueType) => boolean;
};
type SwitchProps = ExtractPropTypes<typeof switchProps>;
type SwitchEmits = typeof switchEmits;
declare function useSwitch(props: SwitchProps, emit: SetupContext<SwitchEmits>['emit']): {
disabled: vue.ComputedRef<boolean>;
modelValue: vue.ComputedRef<string | number | boolean>;
checked: vue.ComputedRef<boolean>;
dotTranslateClasses: vue.ComputedRef<"translate-x-4.5" | "translate-x-5.5" | "translate-x-7.5" | "translate-x-6.5">;
toggle: (evt: MouseEvent) => void;
};
interface ActionSheetAction {
name?: string;
className?: ClassType;
}
declare const actionSheetProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
show: BooleanConstructor;
actions: {
type: vue.PropType<ActionSheetAction[]>;
default: () => ActionSheetAction[];
};
title: StringConstructor;
cancelText: StringConstructor;
description: StringConstructor;
closeable: {
type: BooleanConstructor;
default: true;
};
duration: {
type: NumberConstructor;
default: number;
};
round: {
type: BooleanConstructor;
default: true;
};
};
declare const actionSheetEmits: {
"update:show": (value: boolean) => boolean;
open: () => boolean;
close: () => boolean;
opened: () => boolean;
closed: () => boolean;
cancel: () => boolean;
};
type ActionSheetProps = ExtractPropTypes<typeof actionSheetProps>;
type ActionSheetEmits = typeof actionSheetEmits;
declare function useActionSheet(props: ActionSheetProps, emit: SetupContext<ActionSheetEmits>['emit']): {
showValue: vue.WritableComputedRef<boolean>;
cancelHandler: () => void;
};
declare const dialogProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
show: BooleanConstructor;
title: StringConstructor;
message: StringConstructor;
showConfirmButton: {
type: BooleanConstructor;
default: true;
};
showCancelButton: BooleanConstructor;
confirmButtonText: StringConstructor;
cancelButtonText: StringConstructor;
};
declare const dialogEmits: {
confirm: () => boolean;
cancel: () => boolean;
};
type DialogProps = ExtractPropTypes<typeof dialogProps>;
type DialogEmits = typeof dialogEmits;
interface DialogOptions {
title?: string;
message?: string;
showConfirmButton?: boolean;
showCancelButton?: boolean;
confirmButtonText?: string;
cancelButtonText?: string;
}
interface DialogInst {
showDialog: (options: DialogOptions) => void;
confirm: () => void;
cancel: () => void;
}
declare function useDialog(props: DialogProps, emit: SetupContext<DialogEmits>['emit']): {
showValue: vue.ComputedRef<boolean>;
dialogStatus: vue.Ref<{
title?: string | undefined;
message?: string | undefined;
showConfirmButton?: boolean | undefined;
showCancelButton?: boolean | undefined;
confirmButtonText?: string | undefined;
cancelButtonText?: string | undefined;
}>;
showDialog: (options: DialogOptions) => void;
onConfirm: () => void;
onCancel: () => void;
};
declare const useNotifyTypeProp: {
type: PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
declare const useNotifyPositionProp: {
type: PropType<"default" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right">;
validator: (value: string) => boolean;
default: string;
};
declare const notifyProps: {
customClass: {
type: PropType<ClassType>;
default: string;
};
customStyle: {
type: PropType<vue.StyleValue>;
default: string;
};
type: {
type: PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
position: {
type: PropType<"default" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right">;
validator: (value: string) => boolean;
default: string;
};
message: StringConstructor;
duration: {
type: NumberConstructor;
default: number;
};
showIcon: BooleanConstructor;
customIcon: BooleanConstructor;
showClose: BooleanConstructor;
};
declare const notifyEmits: {
close: () => boolean;
};
type NotifyProps = ExtractPropTypes<typeof notifyProps>;
type NotifyEmits = typeof notifyEmits;
declare const notifyPositionList: readonly ["default", "top", "top-left", "top-right", "bottom", "bottom-left", "bottom-right"];
type NotifyPositionType = typeof notifyPositionList[number];
interface NotifyOptions {
type?: Type;
position?: NotifyPositionType;
message?: string;
duration?: number;
showIcon?: boolean;
customIcon?: boolean;
showClose?: boolean;
}
interface NotifyInst {
show: (options?: NotifyOptions) => void;
close: () => void;
}
declare function useNotify(props: NotifyProps, emit: SetupContext<NotifyEmits>['emit']): {
visible: vue.Ref<boolean>;
state: vue.Ref<{
type?: "default" | "primary" | "success" | "info" | "warning" | "danger" | undefined;
position?: "default" | "top" | "bottom" | "top-left" | "top-right" | "bottom-left" | "bottom-right" | undefined;
message?: string | undefined;
duration?: number | undefined;
showIcon?: boolean | undefined;
customIcon?: boolean | undefined;
showClose?: boolean | undefined;
}>;
classes: vue.ComputedRef<readonly [false | "top-0 left-0 right-0", false | "top-0 left-5 right-5 pt-5", false | "top-0 left-0 pt-5 pl-5", false | "top-0 right-0 pt-5 pr-5", false | "!top-auto bottom-0 left-5 right-5 mb-safe pb-5", false | "!top-auto bottom-5 left-5 mb-safe pl-5", false | "!top-auto bottom-5 right-5 mb-safe pr-5"]>;
show: (options?: NotifyOptions) => void;
close: () => void;
};
declare const overlayProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
show: BooleanConstructor;
duration: {
type: NumberConstructor;
default: number;
};
};
declare const overlayEmits: {
click: (evt: MouseEvent) => boolean;
};
type OverlayProps = ExtractPropTypes<typeof overlayProps>;
type OverlayEmits = typeof overlayEmits;
declare function useOverlay(props: OverlayProps, emit: SetupContext<OverlayEmits>['emit']): {
showValue: vue.ComputedRef<boolean>;
clickHandler: (evt: MouseEvent) => void;
};
declare const collapseProps: {
customClass: {
type: PropType<ClassType>;
default: string;
};
customStyle: {
type: PropType<vue.StyleValue>;
default: string;
};
modelValue: {
type: PropType<string | number | (string | number)[]>;
};
accordion: BooleanConstructor;
};
declare const collapseEmits: {
"update:modelValue": (val: CollapseModelValue) => boolean;
change: (val: CollapseModelValue) => boolean;
};
type CollapseProps = ExtractPropTypes<typeof collapseProps>;
type CollapseEmits = typeof collapseEmits;
declare function useCollapse(props: CollapseProps, emit: SetupContext<CollapseEmits>['emit']): {
activeNames: vue.Ref<(string | number)[]>;
setActiveNames: (_activeNames: CollapseActiveName[]) => void;
};
declare const noticeBarProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
type: {
type: vue.PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
variant: {
type: vue.PropType<VariantType>;
default: string;
};
show: {
type: BooleanConstructor;
default: true;
};
loop: BooleanConstructor;
icon: StringConstructor;
showClose: BooleanConstructor;
};
declare const noticeBarEmits: {
close: () => boolean;
};
type NoticeBarProps = ExtractPropTypes<typeof noticeBarProps>;
type NoticeBarEmits = typeof noticeBarEmits;
declare function useNoticeBar(props: NoticeBarProps, emit: SetupContext<NoticeBarEmits>['emit']): {
handleClose: () => void;
};
declare const useTagTypeProp: {
type: vue.PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
declare const useTagSizeProp: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
declare const tagProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
type: {
type: vue.PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
size: {
type: vue.PropType<"mini" | "small" | "normal" | "large">;
validator: (value: string) => boolean;
default: string;
};
variant: {
type: vue.PropType<VariantType>;
default: string;
};
label: StringConstructor;
disabled: BooleanConstructor;
show: {
type: BooleanConstructor;
default: true;
};
closable: BooleanConstructor;
icon: StringConstructor;
iconOnly: BooleanConstructor;
};
declare const tagEmits: {
click: (evt: MouseEvent) => boolean;
close: (evt: MouseEvent) => boolean;
};
type TagProps = ExtractPropTypes<typeof tagProps>;
type TagEmits = typeof tagEmits;
declare function useTag(props: TagProps, emit: SetupContext<TagEmits>['emit']): {
disabled: vue.ComputedRef<boolean>;
classes: vue.ComputedRef<(string | false | {
'!p-0.5 aspect-square': boolean;
'op-50'?: undefined;
} | {
'op-50': boolean;
'!p-0.5 aspect-square'?: undefined;
})[]>;
clickHandler: (evt: MouseEvent) => void;
closeHandler: (evt: MouseEvent) => void;
};
declare const useBadgeProp: {
type: PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
declare const useBadgeOffsetProp: {
type: PropType<[string | number, string | number]>;
};
declare const badgeProps: {
customClass: {
type: PropType<ClassType>;
default: string;
};
customStyle: {
type: PropType<vue.StyleValue>;
default: string;
};
type: {
type: PropType<"default" | "primary" | "success" | "info" | "warning" | "danger">;
validator: (value: string) => boolean;
default: string;
};
color: StringConstructor;
dot: BooleanConstructor;
offset: {
type: PropType<[string | number, string | number]>;
};
showZero: {
type: BooleanConstructor;
default: true;
};
max: NumberConstructor;
value: (StringConstructor | NumberConstructor)[];
processing: BooleanConstructor;
};
type BadgeProps = ExtractPropTypes<typeof badgeProps>;
type TabBarItemValueType = string | number;
declare const tabBarProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
modelValue: {
type: (StringConstructor | NumberConstructor)[];
default: string;
};
};
declare const tabBarEmits: {
click: (evt: MouseEvent) => boolean;
"update:modelValue": (val: TabBarItemValueType) => boolean;
change: (val: TabBarItemValueType) => boolean;
};
type TabBarProps = ExtractPropTypes<typeof tabBarProps>;
type TabBarEmits = typeof tabBarEmits;
type TabBarType = '';
declare const navBarProps: {
customClass: {
type: vue.PropType<ClassType>;
default: string;
};
customStyle: {
type: vue.PropType<vue.StyleValue>;
default: string;
};
title: StringConstructor;
height: (StringConstructor | NumberConstructor)[];
fixed: BooleanConstructor;
zIndex: (StringConstructor | NumberConstructor)[];
border: {
type: BooleanConstructor;
default: true;
};
leftText: StringConstructor;
rightText: StringConstructor;
leftArrow: BooleanConstructor;
placeholder: BooleanConstructor;
clickable: {
type: BooleanConstructor;
default: true;
};
};
declare const navBarEmits: {
clickLeft: (evt: MouseEvent) => boolean;
clickRight: (evt: MouseEvent) => boolean;
};
type NavBarProps = ExtractPropTypes<typeof navBarProps>;
type NavBarEmits = typeof navBarEmits;
declare function useNavBar(props: NavBarProps, emit: SetupContext<NavBarEmits>['emit']): {
navBarRef: vue.Ref<HTMLElement | undefined>;
hasLeft: vue.ComputedRef<string | true | vue.Slot | undefined>;
hasRight: vue.ComputedRef<string | vue.Slot | undefined>;
className: vue.ComputedRef<{
'a-nav-bar-fixed': boolean;
'a-hairline-bottom': boolean;
}[]>;
clickableClassName: vue.ComputedRef<string>;
zIndexStyle: vue.ComputedRef<CSSProperties>;
placeholderStyle: vue.ComputedRef<{
width: string;
height: string;
}>;
navBarStyle: vue.ComputedRef<{
paddingTop: string;
} | {
paddingTop?: undefined;
}>;
navBarContentStyle: vue.ComputedRef<{
height: string;
}>;
navBarHeight: vue.ComputedRef<number>;
statusBarHeight: number;
clickLeftHandler: (evt: MouseEvent) => void;
clickRightHandler: (evt: MouseEvent) => void;
};
type NavBarType = '';
declare function is(val: unknown, type: string): boolean;
declare function isDef<T = unknown>(val?: T): val is T;
declare function isUnDef<T = unknown>(val?: T): val is T;
declare function isObject(val: any): val is Record<any, any>;
declare function isEmpty<T = unknown>(val: T): val is T;
declare function isDate(val: unknown): val is Date;
declare function isNull(val: unknown): val is null;
declare function isNullAndUnDef(val: unknown): val is null | undefined;
declare function isNullOrUnDef(val: unknown): val is null | undefined;
declare function isNumber(val: unknown): val is number;
declare function isPromise<T = any>(val: unknown): val is Promise<T>;
declare function isString(val: unknown): val is string;
declare function isFunction(val: unknown): val is Function;
declare function isBoolean(val: unknown): val is boolean;
declare function isRegExp(val: unknown): val is RegExp;
declare function isArray(val: any): val is Array<any>;
declare function isWindow(val: any): val is Window;
declare function isElement(val: unknown): val is Element;
declare function isMap(val: unknown): val is Map<any, any>;
declare function isUrl(path: string): boolean;
/**
* prop type helpers
* help us to write less code and reduce bundle size
* copy from https://github.com/youzan/vant/blob/main/packages/vant/src/utils/props.ts
*/
declare const unknownProp: PropType<unknown>;
declare const numericProp: (StringConstructor | NumberConstructor)[];
declare const truthProp: {
type: BooleanConstructor;
default: true;
};
declare function makeRequiredProp<T>(type: T): {
type: T;
required: true;
};
declare function makeArrayProp<T>(defaultVal?: T[]): {
type: PropType<T[]>;
default: () => T[];
};
declare function makeNumberProp<T>(defaultVal: T): {
type: NumberConstructor;
default: T;
};
declare function makeNumericProp<T>(defaultVal: T): {
type: (StringConstructor | NumberConstructor)[];
default: T;
};
declare function makeStringProp<T>(defaultVal: T): {
type: PropType<T>;
default: T;
};
interface Deferred<T> extends Promise<T> {
resolve: (value?: T) => void;
reject: (value?: any) => void;
}
declare function createDeferred<T>(): Deferred<T>;
declare function toArray<T>(value?: T | T[]): T[];
declare function guid(): string;
declare function delay(ms: number): Deferred<void>;
declare function noop(): void;
declare function AnoResolver(): ComponentResolver;
export { type ActionSheetAction, type ActionSheetEmits, type ActionSheetProps, AnoResolver, type AvatarEmits, type AvatarGroupEmits, type AvatarGroupProps, type AvatarOption, type AvatarProps, type BadgeProps, type ButtonEmits, type ButtonProps, type CellEmits, type CellGroupContext, type CellProps, type CheckboxEmits, type CheckboxGroupContext, type CheckboxGroupEmits, type CheckboxGroupProps, type CheckboxProps, type CheckboxValueType, type ClassType, type CollapseActiveName, type CollapseContext, type CollapseEmits, type CollapseModelValue, type CollapseProps, type Deferred, type DialogEmits, type DialogInst, type DialogOptions, type DialogProps, type Direction, type FieldEmits, type FieldInputAlign, type FieldLabelAlign, type FieldProps, type FieldType, type FiledSize, type NavBarEmits, type NavBarProps, type NavBarType, type NoticeBarEmits, type NoticeBarProps, type NotifyEmits, type NotifyInst, type NotifyOptions, type NotifyPositionType, type NotifyProps, type OverlayEmits, type OverlayProps, type PopupEmits, type PopupProps, PositionProp, type PositionType, type RadioEmits, type RadioGroupContext, type RadioGroupEmits, type RadioGroupProps, type RadioProps, type RadioValueType, type SizeType, type SwitchEmits, type SwitchProps, type SwitchValueType, type TabBarEmits, type TabBarProps, type TabBarType, type TagEmits, type TagProps, type ToastEmits, type ToastInst, type ToastOptions, type ToastPositionType, type ToastProps, type ToastType, type Type, type VariantType, actionSheetEmits, actionSheetProps, avatarEmits, avatarGroupEmits, avatarGroupProps, avatarProps, badgeProps, buttonEmits, buttonProps, cellEmits, cellGroupKey, cellProps, checkboxEmits, checkboxGroupEmits, checkboxGroupKey, checkboxGroupProps, checkboxProps, collapseContextKey, collapseEmits, collapseProps, createDeferred, delay, dialogEmits, dialogProps, fieldEmits, fieldProps, guid, is, isArray, isBoolean, isDate, isDef, isElement, isEmpty, isFunction, isMap, isNull, isNullAndUnDef, isNullOrUnDef, isNumber, isObject, isPromise, isRegExp, isString, isUnDef, isUrl, isWindow, makeArrayProp, makeNumberProp, makeNumericProp, makeRequiredProp, makeStringProp, navBarEmits, navBarProps, noop, noticeBarEmits, noticeBarProps, notifyEmits, notifyPositionList, notifyProps, numericProp, overlayEmits, overlayProps, popupEmits, popupProps, radioEmits, radioGroupEmits, radioGroupKey, radioGroupProps, radioProps, switchEmits, switchProps, tabBarEmits, tabBarProps, tagEmits, tagProps, toArray, toastEmits, toastProps, truthProp, unknownProp, useActionSheet, useAvatar, useAvatarGroup, useAvatarSizeProp, useBadgeOffsetProp, useBadgeProp, useButton, useButtonSizeProp, useButtonTypeProp, useCell, useCheckbox, useCheckboxGroupDirectionProp, useCheckboxSizeProp, useCheckboxTypeProp, useCollapse, useCustomClassProp, useCustomStyleProp, useDialog, useDirectionProp, useField, useFieldInputAlignProp, useFieldLabelAlignProp, useFieldTypeProp, useNavBar, useNoticeBar, useNotify, useNotifyPositionProp, useNotifyTypeProp, useOverlay, usePopup, useQuerySelector, useQuerySelectorAll, useRadio, useRadioGroupDirectionProp, useRadioSizeProp, useRadioTypeProp, useSizeProp, useSwitch, useSwitchSizeProp, useSwitchTypeProp, useTag, useTagSizeProp, useTagTypeProp, useToast, useTypeProp, useVariantProp };