@varlet/ui 3.3.15 → 3.4.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/ui",
-  "version": "3.3.15",
+  "version": "3.4.0",
   "description": "A material like components library",
   "main": "lib/varlet.cjs.js",
   "module": "es/index.mjs",
@@ -48,9 +48,9 @@
     "@popperjs/core": "^2.11.6",
     "dayjs": "^1.10.4",
     "decimal.js": "^10.2.1",
-    "@varlet/icons": "3.3.15",
-    "@varlet/shared": "3.3.15",
-    "@varlet/use": "3.3.15"
+    "@varlet/icons": "3.4.0",
+    "@varlet/shared": "3.4.0",
+    "@varlet/use": "3.4.0"
   },
   "devDependencies": {
     "@vue/runtime-core": "3.4.21",
@@ -64,9 +64,9 @@
     "typescript": "^5.1.5",
     "vue": "3.4.21",
     "vue-router": "4.2.0",
-    "@varlet/cli": "3.3.15",
-    "@varlet/touch-emulator": "3.3.15",
-    "@varlet/ui": "3.3.15"
+    "@varlet/cli": "3.4.0",
+    "@varlet/ui": "3.4.0",
+    "@varlet/touch-emulator": "3.4.0"
   },
   "scripts": {
     "dev": "varlet-cli dev",
@@ -76,7 +76,7 @@
     "compile:style-vars": "varlet-cli compile:style-vars",
     "create": "varlet-cli create -i",
     "test": "varlet-cli test",
-    "test:watch": "varlet-cli test -w",
+    "test:watch": "varlet-cli test -w -cov",
     "test:coverage": "varlet-cli test -cov"
   }
 }

package/types/autoComplete.d.ts

@@ -0,0 +1,84 @@
+import {
+  VarComponent,
+  BasicAttributes,
+  ListenerProp,
+  Variant as AutoCompleteVariant,
+  SetPropsDefaults,
+} from './varComponent'
+import { VNode, VNodeChild, type InputHTMLAttributes } from 'vue'
+
+export declare const autoComponentProps: Record<keyof AutoCompleteProps, any>
+
+export type AutoCompleteOptionLabelRender = (option: AutoCompleteOption, checked: boolean) => VNodeChild
+
+export type AutoCompleteOptionLabel = string | VNode | AutoCompleteOptionLabelRender
+
+export type AutoCompleteValidateTrigger = 'onFocus' | 'onBlur' | 'onChange' | 'onClick' | 'onClear' | 'onInput'
+
+export type AutoCompleteSize = 'small' | 'normal'
+
+export interface AutoCompleteOption {
+  label?: AutoCompleteOptionLabel
+  value?: any
+  disabled?: boolean
+
+  [key: PropertyKey]: any
+}
+
+export interface AutoCompleteProps extends BasicAttributes {
+  modelValue?: string
+  labelKey?: string
+  valueKey?: string
+  options?: AutoCompleteOption[]
+  line?: boolean
+  size?: AutoCompleteSize
+  variant?: AutoCompleteVariant
+  placeholder?: string
+  hint?: boolean
+  textColor?: string
+  focusColor?: string
+  blurColor?: string
+  maxlength?: string | number
+  disabled?: boolean
+  readonly?: boolean
+  clearable?: boolean
+  validateTrigger?: AutoCompleteValidateTrigger[]
+  getShow?: (v: string) => boolean
+  rules?: Array<(v: string) => any>
+  enterkeyhint?: InputHTMLAttributes['enterKeyHint']
+  onFocus?: ListenerProp<() => void>
+  onBlur?: ListenerProp<() => void>
+  onClick?: ListenerProp<(e: Event) => void>
+  onClear?: ListenerProp<(value: string) => void>
+  onChange?: ListenerProp<(value: string, e: Event) => void>
+  'onUpdate:modelValue'?: ListenerProp<(value: string) => void>
+}
+
+export interface AutoCompleteClearIconData {
+  clear: (e: Event) => void
+}
+
+export class AutoComplete extends VarComponent {
+  static setPropsDefaults: SetPropsDefaults<AutoCompleteProps>
+
+  $props: AutoCompleteProps
+
+  $slots: {
+    'prepend-icon'(): VNode[]
+    'append-icon'(): VNode[]
+    'clear-icon'(data: AutoCompleteClearIconData): VNode[]
+    'extra-message'(): VNode[]
+  }
+
+  focus(): void
+
+  blur(): void
+
+  validate(): Promise<boolean>
+
+  resetValidation(): void
+
+  reset(): void
+}
+
+export class _AutoCompleteComponent extends AutoComplete {}

package/types/checkbox.d.ts

@@ -3,7 +3,7 @@ import { VNode } from 'vue'
 
 export declare const checkboxProps: Record<keyof CheckboxProps, any>
 
-export type CheckboxValidateTriggers = 'onChange'
+export type CheckboxValidateTrigger = 'onChange'
 
 export interface CheckboxProps extends BasicAttributes {
   modelValue?: any
@@ -16,7 +16,7 @@ export interface CheckboxProps extends BasicAttributes {
   indeterminate?: boolean
   iconSize?: string | number
   ripple?: boolean
-  validateTrigger?: Array<CheckboxValidateTriggers>
+  validateTrigger?: Array<CheckboxValidateTrigger>
   rules?: Array<(value: any) => any>
   onClick?: ListenerProp<(e: Event) => void>
   onChange?: ListenerProp<(value: any) => void>

package/types/index.d.ts

@@ -5,6 +5,7 @@ export const install: (app: App) => void
 
 export * from './actionSheet'
 export * from './appBar'
+export * from './autoComplete'
 export * from './avatar'
 export * from './avatarGroup'
 export * from './backTop'
@@ -98,6 +99,7 @@ declare module 'vue' {
   export interface GlobalComponents {
     VarActionSheet: typeof import('@varlet/ui')['_ActionSheetComponent']
     VarAppBar: typeof import('@varlet/ui')['_AppBarComponent']
+    VarAutoComplete: typeof import('@varlet/ui')['_AutoCompleteComponent']
     VarAvatar: typeof import('@varlet/ui')['_AvatarComponent']
     VarAvatarGroup: typeof import('@varlet/ui')['_AvatarGroupComponent']
     VarBackTop: typeof import('@varlet/ui')['_BackTopComponent']

package/types/input.d.ts

@@ -18,6 +18,7 @@ export interface InputProps extends BasicAttributes {
   rows?: string | number
   placeholder?: string
   hint?: boolean
+  line?: boolean
   textColor?: string
   focusColor?: string
   blurColor?: string

package/types/styleVars.d.ts

@@ -32,6 +32,7 @@ interface BaseStyleVars {
   '--app-bar-border-radius'?: string
   '--app-bar-font-size'?: string
   '--app-bar-border-bottom'?: string
+  '--auto-complete-options-padding'?: string
   '--avatar-text-color'?: string
   '--avatar-border-radius'?: string
   '--avatar-mini-size'?: string