@varlet/ui 2.1.0 → 2.2.0-alpha.1667670228109

package/lib/themes/dark/index.d.ts

@@ -1,5 +1,5 @@
-import { StyleVars } from '../../../types'
-
-declare const dark: StyleVars
-
-export default dark
+import { StyleVars } from '../../../types'
+
+declare const dark: StyleVars
+
+export default dark

package/lib/uploader/Uploader.js

@@ -134,10 +134,10 @@ function render(_ctx, _cache) {
   /* CLASS */
   ), (0, _vue.createVNode)(_component_var_form_details, {
     "error-message": _ctx.errorMessage,
-    "maxlength-text": _ctx.maxlengthText
+    "extra-message": _ctx.maxlengthText
   }, null, 8
   /* PROPS */
-  , ["error-message", "maxlength-text"]), (0, _vue.createVNode)(_component_var_popup, {
+  , ["error-message", "extra-message"]), (0, _vue.createVNode)(_component_var_popup, {
     class: (0, _vue.normalizeClass)(_ctx.n('preview')),
     "var-uploader-cover": "",
     position: "center",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/ui",
-  "version": "2.1.0",
+  "version": "2.2.0-alpha.1667670228109",
   "description": "A material like components library",
   "module": "es/index.js",
   "main": "lib/index.js",
@@ -46,8 +46,8 @@
   },
   "dependencies": {
     "@popperjs/core": "^2.11.6",
-    "@varlet/icons": "2.1.0",
-    "@varlet/shared": "2.1.0",
+    "@varlet/icons": "2.2.0-alpha.1667670228109",
+    "@varlet/shared": "2.2.0-alpha.1667670228109",
     "dayjs": "^1.10.4",
     "decimal.js": "^10.2.1"
   },
@@ -55,8 +55,8 @@
     "@types/jest": "^26.0.15",
     "@types/lodash-es": "^4.17.6",
     "@types/node": "^18.7.18",
-    "@varlet/cli": "2.1.0",
-    "@varlet/touch-emulator": "2.1.0",
+    "@varlet/cli": "2.2.0-alpha.1667670228109",
+    "@varlet/touch-emulator": "2.2.0-alpha.1667670228109",
     "@vue/runtime-core": "3.2.25",
     "@vue/test-utils": "^2.0.2",
     "clipboard": "^2.0.6",

package/types/form.d.ts

@@ -1,5 +1,16 @@
 import { VarComponent, BasicAttributes } from './varComponent'
-import { VNode } from 'vue'
+import { ComputedRef, VNode, Ref } from 'vue'
+
+export interface FormValidation {
+  validate(): Promise<boolean>
+  resetValidation(): void
+  reset(): void
+}
+
+export interface FormProvider {
+  disabled: ComputedRef<boolean>
+  readonly: ComputedRef<boolean>
+}
 
 export interface FormProps extends BasicAttributes {
   disabled?: boolean
@@ -7,6 +18,22 @@ export interface FormProps extends BasicAttributes {
 }
 
 export class Form extends VarComponent {
+  static useForm(): {
+    form: FormProvider | null
+
+    bindForm: ((formValidation: FormValidation) => void) | null
+  }
+
+  static useValidation(): {
+    errorMessage: Ref<string>
+
+    validate(rules: any, value: any, apis?: any): Promise<boolean>
+
+    resetValidation(): void
+
+    validateWithTrigger<T>(validateTrigger: T[], trigger: T, rules: any, value: any, apis?: any): Promise<void>
+  }
+
   $props: FormProps
 
   $slots: {

package/types/formDetails.d.ts

@@ -0,0 +1,12 @@
+import { VarComponent, BasicAttributes } from './varComponent'
+
+export interface FormDetailsProps extends BasicAttributes {
+  errorMessage?: string
+  extraMessage?: string
+}
+
+export class FormDetails extends VarComponent {
+  $props: FormDetailsProps
+}
+
+export class _FormDetailsComponent extends FormDetails {}

package/types/index.d.ts

@@ -23,6 +23,7 @@ export * from './datePicker'
 export * from './dialog'
 export * from './divider'
 export * from './form'
+export * from './formDetails'
 export * from './icon'
 export * from './image'
 export * from './imagePreview'
@@ -91,6 +92,7 @@ declare module 'vue' {
     VarDialog: typeof import('@varlet/ui')['_DialogComponent']
     VarDivider: typeof import('@varlet/ui')['_DividerComponent']
     VarForm: typeof import('@varlet/ui')['_FormComponent']
+    VarFormDetails: typeof import('@varlet/ui')['_FormDetailsComponent']
     VarIcon: typeof import('@varlet/ui')['_IconComponent']
     VarImage: typeof import('@varlet/ui')['_ImageComponent']
     VarImagePreview: typeof import('@varlet/ui')['_ImagePreviewComponent']

package/types/lazy.d.ts

@@ -1,5 +1,5 @@
-import { VarDirective } from './varDirective'
-
-export class Lazy extends VarDirective {}
-
-export class _LazyComponent extends Lazy {}
+import { VarDirective } from './varDirective'
+
+export class Lazy extends VarDirective {}
+
+export class _LazyComponent extends Lazy {}

package/types/ripple.d.ts

@@ -1,5 +1,5 @@
-import { VarDirective } from './varDirective'
-
-export class Ripple extends VarDirective {}
-
-export class _RippleComponent extends Ripple {}
+import { VarDirective } from './varDirective'
+
+export class Ripple extends VarDirective {}
+
+export class _RippleComponent extends Ripple {}

package/types/varDirective.d.ts

@@ -1,12 +1,12 @@
-import type { App } from 'vue'
-import { DirectiveBinding } from '@vue/runtime-core'
-
-export class VarDirective {
-  static install(app: App): void
-
-  static mounted(el: HTMLElement, binding: DirectiveBinding): void
-
-  static updated(el: HTMLElement, binding: DirectiveBinding): void
-
-  static unmounted(el: HTMLElement, binding: DirectiveBinding): void
-}
+import type { App } from 'vue'
+import { DirectiveBinding } from '@vue/runtime-core'
+
+export class VarDirective {
+  static install(app: App): void
+
+  static mounted(el: HTMLElement, binding: DirectiveBinding): void
+
+  static updated(el: HTMLElement, binding: DirectiveBinding): void
+
+  static unmounted(el: HTMLElement, binding: DirectiveBinding): void
+}