From dd53176430003e3f7d79d7a101bb4bf1d4f011fb Mon Sep 17 00:00:00 2001 From: caohuichang Date: Sat, 2 Jul 2022 18:05:04 +0800 Subject: [PATCH 01/59] feat: support vue2 + volar (#2) --- index.d.ts | 2 +- package.json | 9 ++- pnpm-lock.yaml | 175 ++++++++++++++++++++++++++++++++++++++++++++++++- 3 files changed, 179 insertions(+), 7 deletions(-) diff --git a/index.d.ts b/index.d.ts index 27163e4..6436b64 100644 --- a/index.d.ts +++ b/index.d.ts @@ -3,7 +3,7 @@ import type { MethodOptions, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes, EmitsOptions -} from 'vue' +} from 'vue3' type PublicProps = VNodeProps & AllowedComponentProps & ComponentCustomProps; type TComponent

, E extends EmitsOptions> = DefineComponent<{}, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, E, string, PublicProps, Readonly>> diff --git a/package.json b/package.json index 625e290..a99d1db 100644 --- a/package.json +++ b/package.json @@ -1,12 +1,14 @@ { "name": "uni-base-components-types", - "version": "1.1.1", + "version": "2.0.0-beta.0", "description": "uni-app基础组件的类型提示", "typings": "uni-base-components.d.ts", "scripts": { "build": "ts-node src/index.ts" }, - "keywords": ["uni-app"], + "keywords": [ + "uni-app" + ], "author": { "name": "satrong", "email": "satrong@163.com", @@ -18,7 +20,8 @@ }, "license": "MIT", "dependencies": { - "@dcloudio/uni-helper-json": "^1.0.13" + "@dcloudio/uni-helper-json": "^1.0.13", + "vue3": "npm:vue@3" }, "devDependencies": { "@types/node": "^17.0.21", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c921f90..0cf11d8 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1,21 +1,44 @@ -lockfileVersion: 5.3 +lockfileVersion: 5.4 specifiers: '@dcloudio/uni-helper-json': ^1.0.13 '@types/node': ^17.0.21 ts-node: ^10.5.0 typescript: ^4.5.5 + vue3: npm:vue@3 dependencies: '@dcloudio/uni-helper-json': 1.0.13 + vue3: /vue/3.2.37 devDependencies: '@types/node': 17.0.21 - ts-node: 10.5.0_99a448058f874aec2a353d0e974167cc + ts-node: 10.5.0_tgseqbmpq5foykrvhuhjoqlhzq typescript: 4.5.5 packages: + /@babel/helper-validator-identifier/7.18.6: + resolution: {integrity: sha512-MmetCkz9ej86nJQV+sFCxoGGrUbU3q02kgLciwkrt9QqEB7cP39oKEY0PakknEO0Gu20SskMRi+AYZ3b1TpN9g==} + engines: {node: '>=6.9.0'} + dev: false + + /@babel/parser/7.18.6: + resolution: {integrity: sha512-uQVSa9jJUe/G/304lXspfWVpKpK4euFLgGiMQFOCpM/bgcAdeoHwi/OQz23O9GK2osz26ZiXRRV9aV+Yl1O8tw==} + engines: {node: '>=6.0.0'} + hasBin: true + dependencies: + '@babel/types': 7.18.7 + dev: false + + /@babel/types/7.18.7: + resolution: {integrity: sha512-QG3yxTcTIBoAcQmkCs+wAPYZhu7Dk9rXKacINfNbdJDNERTbLQbHGyVG8q/YGMPeCJRIhSY0+fTc5+xuh6WPSQ==} + engines: {node: '>=6.9.0'} + dependencies: + '@babel/helper-validator-identifier': 7.18.6 + to-fast-properties: 2.0.0 + dev: false + /@cspotcode/source-map-consumer/0.8.0: resolution: {integrity: sha512-41qniHzTU8yAGbCp04ohlmSrZf8bkf/iJsl3V0dRGsQN/5GFfx+LbCSsCpp2gqrqjTVg/K6O8ycoV35JIwAzAg==} engines: {node: '>= 12'} @@ -52,6 +75,88 @@ packages: resolution: {integrity: sha512-DBZCJbhII3r90XbQxI8Y9IjjiiOGlZ0Hr32omXIZvwwZ7p4DMMXGrKXVyPfuoBOri9XNtL0UK69jYIBIsRX3QQ==} dev: true + /@vue/compiler-core/3.2.37: + resolution: {integrity: sha512-81KhEjo7YAOh0vQJoSmAD68wLfYqJvoiD4ulyedzF+OEk/bk6/hx3fTNVfuzugIIaTrOx4PGx6pAiBRe5e9Zmg==} + dependencies: + '@babel/parser': 7.18.6 + '@vue/shared': 3.2.37 + estree-walker: 2.0.2 + source-map: 0.6.1 + dev: false + + /@vue/compiler-dom/3.2.37: + resolution: {integrity: sha512-yxJLH167fucHKxaqXpYk7x8z7mMEnXOw3G2q62FTkmsvNxu4FQSu5+3UMb+L7fjKa26DEzhrmCxAgFLLIzVfqQ==} + dependencies: + '@vue/compiler-core': 3.2.37 + '@vue/shared': 3.2.37 + dev: false + + /@vue/compiler-sfc/3.2.37: + resolution: {integrity: sha512-+7i/2+9LYlpqDv+KTtWhOZH+pa8/HnX/905MdVmAcI/mPQOBwkHHIzrsEsucyOIZQYMkXUiTkmZq5am/NyXKkg==} + dependencies: + '@babel/parser': 7.18.6 + '@vue/compiler-core': 3.2.37 + '@vue/compiler-dom': 3.2.37 + '@vue/compiler-ssr': 3.2.37 + '@vue/reactivity-transform': 3.2.37 + '@vue/shared': 3.2.37 + estree-walker: 2.0.2 + magic-string: 0.25.9 + postcss: 8.4.14 + source-map: 0.6.1 + dev: false + + /@vue/compiler-ssr/3.2.37: + resolution: {integrity: sha512-7mQJD7HdXxQjktmsWp/J67lThEIcxLemz1Vb5I6rYJHR5vI+lON3nPGOH3ubmbvYGt8xEUaAr1j7/tIFWiEOqw==} + dependencies: + '@vue/compiler-dom': 3.2.37 + '@vue/shared': 3.2.37 + dev: false + + /@vue/reactivity-transform/3.2.37: + resolution: {integrity: sha512-IWopkKEb+8qpu/1eMKVeXrK0NLw9HicGviJzhJDEyfxTR9e1WtpnnbYkJWurX6WwoFP0sz10xQg8yL8lgskAZg==} + dependencies: + '@babel/parser': 7.18.6 + '@vue/compiler-core': 3.2.37 + '@vue/shared': 3.2.37 + estree-walker: 2.0.2 + magic-string: 0.25.9 + dev: false + + /@vue/reactivity/3.2.37: + resolution: {integrity: sha512-/7WRafBOshOc6m3F7plwzPeCu/RCVv9uMpOwa/5PiY1Zz+WLVRWiy0MYKwmg19KBdGtFWsmZ4cD+LOdVPcs52A==} + dependencies: + '@vue/shared': 3.2.37 + dev: false + + /@vue/runtime-core/3.2.37: + resolution: {integrity: sha512-JPcd9kFyEdXLl/i0ClS7lwgcs0QpUAWj+SKX2ZC3ANKi1U4DOtiEr6cRqFXsPwY5u1L9fAjkinIdB8Rz3FoYNQ==} + dependencies: + '@vue/reactivity': 3.2.37 + '@vue/shared': 3.2.37 + dev: false + + /@vue/runtime-dom/3.2.37: + resolution: {integrity: sha512-HimKdh9BepShW6YozwRKAYjYQWg9mQn63RGEiSswMbW+ssIht1MILYlVGkAGGQbkhSh31PCdoUcfiu4apXJoPw==} + dependencies: + '@vue/runtime-core': 3.2.37 + '@vue/shared': 3.2.37 + csstype: 2.6.20 + dev: false + + /@vue/server-renderer/3.2.37: + resolution: {integrity: sha512-kLITEJvaYgZQ2h47hIzPh2K3jG8c1zCVbp/o/bzQOyvzaKiCquKS7AaioPI28GNxIsE/zSx+EwWYsNxDCX95MA==} + peerDependencies: + vue: 3.2.37 + dependencies: + '@vue/compiler-ssr': 3.2.37 + '@vue/shared': 3.2.37 + dev: false + + /@vue/shared/3.2.37: + resolution: {integrity: sha512-4rSJemR2NQIo9Klm1vabqWjD8rs/ZaJSzMxkMNeJS6lHiUjjUeYFbooN19NgFjztubEKh3WlZUeOLVdbbUWHsw==} + dev: false + /acorn-walk/8.2.0: resolution: {integrity: sha512-k+iyHEuPgSw6SbuDpGQM+06HQUa04DZ3o+F6CSzXMvvI5KMvnaEqXe+YVe555R9nn6GPt404fos4wcgpw12SDA==} engines: {node: '>=0.4.0'} @@ -71,16 +176,68 @@ packages: resolution: {integrity: sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==} dev: true + /csstype/2.6.20: + resolution: {integrity: sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==} + dev: false + /diff/4.0.2: resolution: {integrity: sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==} engines: {node: '>=0.3.1'} dev: true + /estree-walker/2.0.2: + resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==} + dev: false + + /magic-string/0.25.9: + resolution: {integrity: sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==} + dependencies: + sourcemap-codec: 1.4.8 + dev: false + /make-error/1.3.6: resolution: {integrity: sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==} dev: true - /ts-node/10.5.0_99a448058f874aec2a353d0e974167cc: + /nanoid/3.3.4: + resolution: {integrity: sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==} + engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} + hasBin: true + dev: false + + /picocolors/1.0.0: + resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==} + dev: false + + /postcss/8.4.14: + resolution: {integrity: sha512-E398TUmfAYFPBSdzgeieK2Y1+1cpdxJx8yXbK/m57nRhKSmk1GB2tO4lbLBtlkfPQTDKfe4Xqv1ASWPpayPEig==} + engines: {node: ^10 || ^12 || >=14} + dependencies: + nanoid: 3.3.4 + picocolors: 1.0.0 + source-map-js: 1.0.2 + dev: false + + /source-map-js/1.0.2: + resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==} + engines: {node: '>=0.10.0'} + dev: false + + /source-map/0.6.1: + resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==} + engines: {node: '>=0.10.0'} + dev: false + + /sourcemap-codec/1.4.8: + resolution: {integrity: sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==} + dev: false + + /to-fast-properties/2.0.0: + resolution: {integrity: sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==} + engines: {node: '>=4'} + dev: false + + /ts-node/10.5.0_tgseqbmpq5foykrvhuhjoqlhzq: resolution: {integrity: sha512-6kEJKwVxAJ35W4akuiysfKwKmjkbYxwQMTBaAxo9KKAx/Yd26mPUyhGz3ji+EsJoAgrLqVsYHNuuYwQe22lbtw==} hasBin: true peerDependencies: @@ -121,6 +278,18 @@ packages: resolution: {integrity: sha512-mpSYqfsFvASnSn5qMiwrr4VKfumbPyONLCOPmsR3A6pTY/r0+tSaVbgPWSAIuzbk3lCTa+FForeTiO+wBQGkjA==} dev: true + /vue/3.2.37: + resolution: {integrity: sha512-bOKEZxrm8Eh+fveCqS1/NkG/n6aMidsI6hahas7pa0w/l7jkbssJVsRhVDs07IdDq7h9KHswZOgItnwJAgtVtQ==} + dependencies: + '@vue/compiler-dom': 3.2.37 + '@vue/compiler-sfc': 3.2.37 + '@vue/runtime-dom': 3.2.37 + '@vue/server-renderer': 3.2.37 + '@vue/shared': 3.2.37 + transitivePeerDependencies: + - vue + dev: false + /yn/3.1.1: resolution: {integrity: sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==} engines: {node: '>=6'} From f5c15ffa7d168405289019698394c3bd1e7ed694 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 10:06:52 +0800 Subject: [PATCH 02/59] fix: fix tpl --- src/tpl.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/tpl.ts b/src/tpl.ts index 8b5110b..9e432cd 100644 --- a/src/tpl.ts +++ b/src/tpl.ts @@ -3,9 +3,9 @@ export const baseTpl = `import type { MethodOptions, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ExtractPropTypes, EmitsOptions -} from 'vue' +} from 'vue3' type PublicProps = VNodeProps & AllowedComponentProps & ComponentCustomProps; type TComponent

, E extends EmitsOptions> = DefineComponent<{}, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, E, string, PublicProps, Readonly>> -` \ No newline at end of file +`; From 47a771f05ef5735f3c9b43b113fe800987161018 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 10:53:02 +0800 Subject: [PATCH 03/59] chore: remove src --- src/fix.ts | 34 ---------------------- src/index.ts | 80 ---------------------------------------------------- src/tpl.ts | 11 -------- 3 files changed, 125 deletions(-) delete mode 100644 src/fix.ts delete mode 100644 src/index.ts delete mode 100644 src/tpl.ts diff --git a/src/fix.ts b/src/fix.ts deleted file mode 100644 index a3d1d52..0000000 --- a/src/fix.ts +++ /dev/null @@ -1,34 +0,0 @@ -/** - * 针对处理多个组件属性同名，而 attributes.json 中只能存一个属性， - * 导致最后得到的类型错误（vetur 的 attributes.json 问题） - */ -export default { - picker: { - mode: { - description: 'selector 普通选择器, multiSelector 多列选择器, time 时间选择器, date 日期选择器, region 省市区选择器', - type: 'String', - options: ['selector', 'multiSelector', 'time', 'date', 'region'] - } - }, - image: { - mode: { - description: '图片裁剪、缩放的模式', - type: 'String', - options: ['scaleToFill', 'aspectFit', 'aspectFill', 'widthFix', 'heightFix', 'top', 'bottom', 'center', 'left', 'right', 'top left', 'top right', 'bottom left', 'bottom right'] - } - }, - 'live-player': { - mode: { - description: 'live（直播），RTC（实时通话，该模式时延更低）', - type: 'String', - options: ['live', 'RTC'] - } - }, - 'live-pusher': { - mode: { - description: '推流视频模式，可取值：SD（标清）, HD（高清）, FHD（超清）。', - type: 'String', - options: ['SD', 'HD', 'FHD'] - } - } -} as Record> diff --git a/src/index.ts b/src/index.ts deleted file mode 100644 index 344b1e6..0000000 --- a/src/index.ts +++ /dev/null @@ -1,80 +0,0 @@ -import * as fs from 'fs' -import * as path from 'path' - -import TAGS from '@dcloudio/uni-helper-json/dist/tags.json' -import ATTRS from '@dcloudio/uni-helper-json/dist/attributes.json' -import FIX from './fix' - -import { baseTpl } from './tpl' - -type Tags = Record - -const baseType = ['number', 'string', 'array', 'object', 'boolean'] - -function toCamel(str: string, isUpper = true) { - return str.split('-').map((s, index) => { - const firstWord = s.charAt(0) - return (!isUpper && index === 0 ? firstWord.toLowerCase() : firstWord.toUpperCase()) + s.slice(1) - }).join('') -} - -function getType(type: string) { - return type.toLowerCase().split('|').map(el => { - let t = '' - if (baseType.includes(el)) t = el - else t = baseType.find(e => el.indexOf(e) > -1) || 'string' - - switch (t) { - case 'array': return 'any[]'; - case 'object': return 'Record'; - default: return t - } - }).join(' | ') -} - -function tpl(tag: string, props: Record[], description: string) { - const propsStr = props.map((item) => { - const type = item.type !== 'Boolean' && item.options ? item.options.map((el: string) => `'${el}'`).join(' | ') : getType(item.type) - return ` /** ${item.description} */ - ${toCamel(item.attrName, false)}: ${type};` - }).join('\n') - - return `/** ${description} */ -type T${toCamel(tag)} = TComponent<{ -${propsStr} -}, {}>;` -} - -async function bootstrap() { - const tagsData: Tags = TAGS - const tags: string[] = [] - const contents: string[] = [] - for (const [key, val] of Object.entries(tagsData)) { - let attrs: Record[] = [] - if (val.attributes) { - attrs = [...new Set(val.attributes)].map(el => { - if (FIX[key]?.[el]) { - return { attrName: el, ...FIX[key][el] } - } - - const v = ATTRS[el as keyof typeof ATTRS] - if (v) return { attrName: el, ...v } - return null - }).filter(Boolean) as Record[] - } - contents.push(tpl(key, attrs, val.description || '')) - tags.push(toCamel(key)) - } - - const results = baseTpl + contents.join('\n\n') + `\n -declare module 'vue' { - export interface GlobalComponents { -${tags.map(el => ` ${el}: T${el};`).join('\n')} - } -} -` - - await fs.promises.writeFile(path.resolve('./index.d.ts'), results, 'utf8') -} - -bootstrap() diff --git a/src/tpl.ts b/src/tpl.ts deleted file mode 100644 index 9e432cd..0000000 --- a/src/tpl.ts +++ /dev/null @@ -1,11 +0,0 @@ -export const baseTpl = `import type { - DefineComponent, ComputedOptions, - MethodOptions, ComponentOptionsMixin, - VNodeProps, AllowedComponentProps, ComponentCustomProps, - ExtractPropTypes, EmitsOptions -} from 'vue3' -type PublicProps = VNodeProps & AllowedComponentProps & ComponentCustomProps; - -type TComponent

, E extends EmitsOptions> = DefineComponent<{}, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, E, string, PublicProps, Readonly>> - -`; From 657ac64dc50cb11cdcaabe8118400ccc7919f912 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 10:53:08 +0800 Subject: [PATCH 04/59] docs: update README --- README.md | 11 +++-------- 1 file changed, 3 insertions(+), 8 deletions(-) diff --git a/README.md b/README.md index 485c057..93f969b 100644 --- a/README.md +++ b/README.md @@ -1,23 +1,18 @@ # uni-base-components-types -> 将 [__@dcloudio/uni-helper-json__](https://www.npmjs.com/package/@dcloudio/uni-helper-json) 的 json 文件转换成 `.d.ts`，使得在使用 Volar 插件时 uni-app 的基础组件有代码提示 - -## 使用方法 - 1. 安装依赖 ```bash npm i -D uni-base-components-types ``` -2. 配置 _ts.config.json_ 文件 -在 `types` 字段中添加 `uni-base-components-types` +2. 配置 `tsconfig.json` ```json { "compilerOptions": { - "types": ["uni-base-components-types"], - }, + "types": ["uni-base-components-types"] + } } ``` From c222b2a48e921021a075c229189112d20c9d541b Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 10:53:25 +0800 Subject: [PATCH 05/59] style: format --- index.d.ts | 1668 +++++++++++++++++++++++++++++----------------------- 1 file changed, 924 insertions(+), 744 deletions(-) diff --git a/index.d.ts b/index.d.ts index 6436b64..ef0818b 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1,842 +1,1022 @@ import type { - DefineComponent, ComputedOptions, - MethodOptions, ComponentOptionsMixin, - VNodeProps, AllowedComponentProps, ComponentCustomProps, - ExtractPropTypes, EmitsOptions -} from 'vue3' + DefineComponent, + ComputedOptions, + MethodOptions, + ComponentOptionsMixin, + VNodeProps, + AllowedComponentProps, + ComponentCustomProps, + ExtractPropTypes, + EmitsOptions, +} from "vue3"; type PublicProps = VNodeProps & AllowedComponentProps & ComponentCustomProps; -type TComponent

, E extends EmitsOptions> = DefineComponent<{}, {}, {}, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentOptionsMixin, E, string, PublicProps, Readonly>> +type TComponent< + P extends Record, + E extends EmitsOptions +> = DefineComponent< + {}, + {}, + {}, + ComputedOptions, + MethodOptions, + ComponentOptionsMixin, + ComponentOptionsMixin, + E, + string, + PublicProps, + Readonly> +>; /** block节点 */ -type TBlock = TComponent<{ - -}, {}>; +type TBlock = TComponent<{}, {}>; /** 基本视图容器 */ -type TView = TComponent<{ - /** 指定按下去的样式类。当 hover-class="none" 时，没有点击态效果 */ - hoverClass: string; - /** 指定是否阻止本节点的祖先节点出现点击态 */ - hoverStopPropagation: boolean; - /** 按住后多久出现点击态，单位毫秒 */ - hoverStartTime: number; - /** 手指松开后点击态保留时间，单位毫秒 */ - hoverStayTime: number; -}, {}>; +type TView = TComponent< + { + /** 指定按下去的样式类。当 hover-class="none" 时，没有点击态效果 */ + hoverClass: string; + /** 指定是否阻止本节点的祖先节点出现点击态 */ + hoverStopPropagation: boolean; + /** 按住后多久出现点击态，单位毫秒 */ + hoverStartTime: number; + /** 手指松开后点击态保留时间，单位毫秒 */ + hoverStayTime: number; + }, + {} +>; /** 可滚动视图区域 */ -type TScrollView = TComponent<{ - /** 允许横向滚动 */ - scrollX: boolean; - /** 允许纵向滚动 */ - scrollY: boolean; - /** 距顶部/左边多远时（单位px），触发 scrolltoupper 事件 */ - upperThreshold: number; - /** 距底部/右边多远时（单位px），触发 scrolltolower 事件 */ - lowerThreshold: number; - /** 滚动位置，可以使用 px 或者 rpx 为单位，在被设置时，页面会滚动到对应位置 */ - scrollTop: string; - /** 设置横向滚动条位置 */ - scrollLeft: number; - /** 值应为某子元素id（id不能以数字开头）。设置哪个方向可滚动，则在哪个方向滚动到该元素 */ - scrollIntoView: string; - /** 在设置滚动条位置时使用动画过渡 */ - scrollWithAnimation: boolean; - /** iOS点击顶部状态栏、安卓双击标题栏时，滚动条返回顶部，只支持竖向 */ - enableBackToTop: boolean; -}, {}>; +type TScrollView = TComponent< + { + /** 允许横向滚动 */ + scrollX: boolean; + /** 允许纵向滚动 */ + scrollY: boolean; + /** 距顶部/左边多远时（单位px），触发 scrolltoupper 事件 */ + upperThreshold: number; + /** 距底部/右边多远时（单位px），触发 scrolltolower 事件 */ + lowerThreshold: number; + /** 滚动位置，可以使用 px 或者 rpx 为单位，在被设置时，页面会滚动到对应位置 */ + scrollTop: string; + /** 设置横向滚动条位置 */ + scrollLeft: number; + /** 值应为某子元素id（id不能以数字开头）。设置哪个方向可滚动，则在哪个方向滚动到该元素 */ + scrollIntoView: string; + /** 在设置滚动条位置时使用动画过渡 */ + scrollWithAnimation: boolean; + /** iOS点击顶部状态栏、安卓双击标题栏时，滚动条返回顶部，只支持竖向 */ + enableBackToTop: boolean; + }, + {} +>; /** media query 匹配检测节点 */ -type TMatchMedia = TComponent<{ - /** 页面宽度（px 为单位） */ - width: number; - /** 页面最小宽度（px 为单位） */ - minWidth: number; - /** 页面最大宽度（px 为单位） */ - maxWidth: number; - /** 页面高度（px 为单位） */ - height: number; - /** 页面最小高度（px 为单位） */ - minHeight: number; - /** 页面最大高度（px 为单位） */ - maxHeight: number; - /** 画面方向，可选值有 vertical，horizontal */ - orientation: 'vertical' | 'horizontal'; -}, {}>; +type TMatchMedia = TComponent< + { + /** 页面宽度（px 为单位） */ + width: number; + /** 页面最小宽度（px 为单位） */ + minWidth: number; + /** 页面最大宽度（px 为单位） */ + maxWidth: number; + /** 页面高度（px 为单位） */ + height: number; + /** 页面最小高度（px 为单位） */ + minHeight: number; + /** 页面最大高度（px 为单位） */ + maxHeight: number; + /** 画面方向，可选值有 vertical，horizontal */ + orientation: "vertical" | "horizontal"; + }, + {} +>; /** 滑块视图容器 */ -type TSwiper = TComponent<{ - /** 是否显示面板指示点 */ - indicatorDots: boolean; - /** 指示点颜色 */ - indicatorColor: string; - /** 当前选中的指示点颜色 */ - indicatorActiveColor: string; - /** swiper-item 可见时的 class */ - activeClass: string; - /** acceleration 设置为 {{true}} 时且处于滑动过程中，中间若干屏处于可见时的class */ - changingClass: boolean; - /** 当开启时，会根据滑动速度，连续滑动多屏 */ - acceleration: boolean; - /** 是否禁用代码变动触发 swiper 切换时使用动画。 */ - disableProgrammaticAnimation: boolean; - /** 是否禁止用户 touch 操作 */ - disableTouch: boolean; - /** 是否监听用户的触摸事件 */ - touchable: boolean; - /** 指定 swiper 切换缓动动画类型，有效值：default、linear、easeInCubic、easeOutCubic、easeInOutCubic */ - easingFunction: string; - /** 自动播放 */ - autoplay: boolean; - /** 当前所在滑块的 index */ - current: number; - /** 当前所在滑块的 item-id ，不能与 current 被同时指定 */ - currentItemId: string; - /** 自动切换时间间隔 */ - interval: number; - /** 指定视频长度 */ - duration: number; - /** 是否采用衔接滑动 */ - circular: boolean; - /** 滑动方向是否为纵向 */ - vertical: boolean; - /** 前边距，可用于露出前一项的一小部分，接受 px 和 rpx 值 */ - previousMargin: string; - /** 后边距，可用于露出后一项的一小部分，接受 px 和 rpx 值 */ - nextMargin: string; - /** 同时显示的滑块数量 */ - displayMultipleItems: number; - /** 是否跳过未显示的滑块布局，设为 true 可优化复杂情况下的滑动性能，但会丢失隐藏状态滑块的布局信息 */ - skipHiddenItemLayout: boolean; -}, {}>; +type TSwiper = TComponent< + { + /** 是否显示面板指示点 */ + indicatorDots: boolean; + /** 指示点颜色 */ + indicatorColor: string; + /** 当前选中的指示点颜色 */ + indicatorActiveColor: string; + /** swiper-item 可见时的 class */ + activeClass: string; + /** acceleration 设置为 {{true}} 时且处于滑动过程中，中间若干屏处于可见时的class */ + changingClass: boolean; + /** 当开启时，会根据滑动速度，连续滑动多屏 */ + acceleration: boolean; + /** 是否禁用代码变动触发 swiper 切换时使用动画。 */ + disableProgrammaticAnimation: boolean; + /** 是否禁止用户 touch 操作 */ + disableTouch: boolean; + /** 是否监听用户的触摸事件 */ + touchable: boolean; + /** 指定 swiper 切换缓动动画类型，有效值：default、linear、easeInCubic、easeOutCubic、easeInOutCubic */ + easingFunction: string; + /** 自动播放 */ + autoplay: boolean; + /** 当前所在滑块的 index */ + current: number; + /** 当前所在滑块的 item-id ，不能与 current 被同时指定 */ + currentItemId: string; + /** 自动切换时间间隔 */ + interval: number; + /** 指定视频长度 */ + duration: number; + /** 是否采用衔接滑动 */ + circular: boolean; + /** 滑动方向是否为纵向 */ + vertical: boolean; + /** 前边距，可用于露出前一项的一小部分，接受 px 和 rpx 值 */ + previousMargin: string; + /** 后边距，可用于露出后一项的一小部分，接受 px 和 rpx 值 */ + nextMargin: string; + /** 同时显示的滑块数量 */ + displayMultipleItems: number; + /** 是否跳过未显示的滑块布局，设为 true 可优化复杂情况下的滑动性能，但会丢失隐藏状态滑块的布局信息 */ + skipHiddenItemLayout: boolean; + }, + {} +>; /** 仅可放置在 swiper 组件中，宽高自动设置为100% */ -type TSwiperItem = TComponent<{ - /** 该 swiper-item 的标识符 */ - itemId: string; -}, {}>; +type TSwiperItem = TComponent< + { + /** 该 swiper-item 的标识符 */ + itemId: string; + }, + {} +>; /** 可移动的视图容器，在页面中可以拖拽滑动 */ -type TMovableView = TComponent<{ - /** movable-view 的移动方向。 */ - direction: 'all' | 'vertical' | 'horizontal' | 'none'; - /** movable-view 是否带有惯性。 */ - inertia: boolean; - /** 超过可移动区域后，movable-view 是否还可以移动。 */ - outOfBounds: boolean; - /** 定义 x 轴方向的偏移，如果 x 的值不在可移动范围内，会自动移动到可移动范围；改变 x 的值会触发动画。 */ - x: string | number; - /** 定义 y 轴方向的偏移，如果 y 的值不在可移动范围内，会自动移动到可移动范围；改变 y 的值会触发动画。 */ - y: string | number; - /** 阻尼系数，用于控制 x 或 y 改变时的动画和过界回弹的动画，值越大移动越快。 */ - damping: number; - /** 摩擦系数，用于控制惯性滑动的动画，值越大摩擦力越大，滑动越快停止；必须大于0，否则会被设置成默认值 2。 */ - friction: number; - /** 是否禁用。 */ - disabled: boolean; - /** 是否支持双指缩放，默认缩放手势生效区域是在 movable-view 内。 */ - scale: boolean; - /** 定义缩放倍数最小值，默认为 0.5。 */ - scaleMin: number; - /** 定义缩放倍数最大值，默认为 10。 */ - scaleMax: number; - /** 定义缩放倍数，取值范围为 0.5 - 10 */ - scaleValue: number; - /** 是否使用动画，默认为 true。 */ - animation: boolean; -}, {}>; +type TMovableView = TComponent< + { + /** movable-view 的移动方向。 */ + direction: "all" | "vertical" | "horizontal" | "none"; + /** movable-view 是否带有惯性。 */ + inertia: boolean; + /** 超过可移动区域后，movable-view 是否还可以移动。 */ + outOfBounds: boolean; + /** 定义 x 轴方向的偏移，如果 x 的值不在可移动范围内，会自动移动到可移动范围；改变 x 的值会触发动画。 */ + x: string | number; + /** 定义 y 轴方向的偏移，如果 y 的值不在可移动范围内，会自动移动到可移动范围；改变 y 的值会触发动画。 */ + y: string | number; + /** 阻尼系数，用于控制 x 或 y 改变时的动画和过界回弹的动画，值越大移动越快。 */ + damping: number; + /** 摩擦系数，用于控制惯性滑动的动画，值越大摩擦力越大，滑动越快停止；必须大于0，否则会被设置成默认值 2。 */ + friction: number; + /** 是否禁用。 */ + disabled: boolean; + /** 是否支持双指缩放，默认缩放手势生效区域是在 movable-view 内。 */ + scale: boolean; + /** 定义缩放倍数最小值，默认为 0.5。 */ + scaleMin: number; + /** 定义缩放倍数最大值，默认为 10。 */ + scaleMax: number; + /** 定义缩放倍数，取值范围为 0.5 - 10 */ + scaleValue: number; + /** 是否使用动画，默认为 true。 */ + animation: boolean; + }, + {} +>; /** movable-view 的可移动区域 */ -type TMovableArea = TComponent<{ - -}, {}>; +type TMovableArea = TComponent<{}, {}>; /** 文本 */ -type TText = TComponent<{ - /** 文本是否可选 */ - selectable: boolean; - /** 显示连续空格 */ - space: 'ensp' | 'emsp' | 'nbsp'; - /** 是否解码 */ - decode: boolean; -}, {}>; +type TText = TComponent< + { + /** 文本是否可选 */ + selectable: boolean; + /** 显示连续空格 */ + space: "ensp" | "emsp" | "nbsp"; + /** 是否解码 */ + decode: boolean; + }, + {} +>; /** 富文本 */ -type TRichText = TComponent<{ - /** 节点列表 */ - nodes: any[]; -}, {}>; +type TRichText = TComponent< + { + /** 节点列表 */ + nodes: any[]; + }, + {} +>; /** 进度条 */ -type TProgress = TComponent<{ - /** 百分比0~100 */ - percent: number; - /** 在进度条右侧显示百分比 */ - showInfo: boolean; - /** 进度条线的宽度，单位px */ - strokeWidth: number; - /** switch 的颜色，同 css 的 color */ - color: string; - /** radio已选择的颜色 */ - activeColor: string; - /** radio背景条的颜色 */ - backgroundColor: string; - /** 进度条从左往右的动画 */ - active: boolean; - /** backwards: 动画从头播；forwards：动画从上次结束点接着播 */ - activeMode: string; -}, {}>; +type TProgress = TComponent< + { + /** 百分比0~100 */ + percent: number; + /** 在进度条右侧显示百分比 */ + showInfo: boolean; + /** 进度条线的宽度，单位px */ + strokeWidth: number; + /** switch 的颜色，同 css 的 color */ + color: string; + /** radio已选择的颜色 */ + activeColor: string; + /** radio背景条的颜色 */ + backgroundColor: string; + /** 进度条从左往右的动画 */ + active: boolean; + /** backwards: 动画从头播；forwards：动画从上次结束点接着播 */ + activeMode: string; + }, + {} +>; /** 按钮 */ -type TButton = TComponent<{ - /** 是否禁用。 */ - disabled: boolean; - /** 指定按下去的样式类。当 hover-class="none" 时，没有点击态效果 */ - hoverClass: string; - /** 指定是否阻止本节点的祖先节点出现点击态 */ - hoverStopPropagation: boolean; - /** 按住后多久出现点击态，单位毫秒 */ - hoverStartTime: number; - /** 手指松开后点击态保留时间，单位毫秒 */ - hoverStayTime: number; - /** 按钮的大小 */ - size: 'default' | 'mini'; - /** 开放数据类型 */ - type: string; - /** 按钮是否镂空，背景色透明 */ - plain: boolean; - /** 是否在导航条显示 loading 加载提示 */ - loading: boolean; - /** 用于 form 组件，点击分别会触发 form 组件的 submit/reset 事件 */ - formType: 'submit' | 'reset'; - /** 跳转方式 */ - openType: 'navigate' | 'redirect' | 'switchTab' | 'reLaunch' | 'navigateBack'; - /** */ - lang: 'ts'; - /** 会话来源 */ - sessionFrom: string; - /** 会话内消息卡片标题 */ - sendMessageTitle: string; - /** 会话内消息卡片点击跳转应用路径 */ - sendMessagePath: string; - /** 会话内消息卡片图片 */ - sendMessageImg: string; - /** 显示会话内消息卡片 */ - showMessageCard: boolean; - /** 打开 APP 时，向 APP 传递的参数 */ - appParameter: string; -}, {}>; +type TButton = TComponent< + { + /** 是否禁用。 */ + disabled: boolean; + /** 指定按下去的样式类。当 hover-class="none" 时，没有点击态效果 */ + hoverClass: string; + /** 指定是否阻止本节点的祖先节点出现点击态 */ + hoverStopPropagation: boolean; + /** 按住后多久出现点击态，单位毫秒 */ + hoverStartTime: number; + /** 手指松开后点击态保留时间，单位毫秒 */ + hoverStayTime: number; + /** 按钮的大小 */ + size: "default" | "mini"; + /** 开放数据类型 */ + type: string; + /** 按钮是否镂空，背景色透明 */ + plain: boolean; + /** 是否在导航条显示 loading 加载提示 */ + loading: boolean; + /** 用于 form 组件，点击分别会触发 form 组件的 submit/reset 事件 */ + formType: "submit" | "reset"; + /** 跳转方式 */ + openType: + | "navigate" + | "redirect" + | "switchTab" + | "reLaunch" + | "navigateBack"; + /** */ + lang: "ts"; + /** 会话来源 */ + sessionFrom: string; + /** 会话内消息卡片标题 */ + sendMessageTitle: string; + /** 会话内消息卡片点击跳转应用路径 */ + sendMessagePath: string; + /** 会话内消息卡片图片 */ + sendMessageImg: string; + /** 显示会话内消息卡片 */ + showMessageCard: boolean; + /** 打开 APP 时，向 APP 传递的参数 */ + appParameter: string; + }, + {} +>; /** 多项选择器，内部由多个checkbox组成 */ -type TCheckboxGroup = TComponent<{ - -}, {}>; +type TCheckboxGroup = TComponent<{}, {}>; /** 多选项目 */ -type TCheckbox = TComponent<{ - /** 是否禁用。 */ - disabled: boolean; - /** radio当前取值 */ - value: number; - /** 是否选中 */ - checked: boolean; - /** switch 的颜色，同 css 的 color */ - color: string; -}, {}>; +type TCheckbox = TComponent< + { + /** 是否禁用。 */ + disabled: boolean; + /** radio当前取值 */ + value: number; + /** 是否选中 */ + checked: boolean; + /** switch 的颜色，同 css 的 color */ + color: string; + }, + {} +>; /** 表单 */ -type TForm = TComponent<{ - /** 是否禁用。 */ - disabled: boolean; - /** 是否返回 formId 用于发送模板消息 */ - reportSubmit: boolean; -}, {}>; +type TForm = TComponent< + { + /** 是否禁用。 */ + disabled: boolean; + /** 是否返回 formId 用于发送模板消息 */ + reportSubmit: boolean; + }, + {} +>; /** 输入框 */ -type TInput = TComponent<{ - /** 是否禁用。 */ - disabled: boolean; - /** radio当前取值 */ - value: number; - /** 开放数据类型 */ - type: string; - /** 是否是密码类型 */ - password: boolean; - /** 提示信息。 */ - placeholder: string; - /** 指定 placeholder 的样式 */ - placeholderStyle: string; - /** 指定 placeholder 的样式类 */ - placeholderClass: string; - /** 最大输入长度，设置为 -1 的时候不限制最大长度 */ - maxlength: number; - /** 指定光标与键盘的距离，单位 px 。取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 */ - cursorSpacing: number; - /** 获取焦点 */ - autoFocus: boolean; - /** 获取焦点 */ - focus: boolean; - /** 设置键盘右下角按钮的文字 */ - confirmType: 'send' | 'search' | 'next' | 'go' | 'done'; - /** 点击键盘右下角按钮时是否保持键盘不收起 */ - confirmHold: boolean; - /** 指定focus时的光标位置 */ - cursor: number; - /** 光标起始位置，自动聚集时有效，需与selection-end搭配使用 */ - selectionStart: number; - /** 光标结束位置，自动聚集时有效，需与selection-satrt搭配使用 */ - selectionEnd: number; - /** 键盘弹起时，是否自动上推页面 */ - adjustPosition: boolean; -}, {}>; +type TInput = TComponent< + { + /** 是否禁用。 */ + disabled: boolean; + /** radio当前取值 */ + value: number; + /** 开放数据类型 */ + type: string; + /** 是否是密码类型 */ + password: boolean; + /** 提示信息。 */ + placeholder: string; + /** 指定 placeholder 的样式 */ + placeholderStyle: string; + /** 指定 placeholder 的样式类 */ + placeholderClass: string; + /** 最大输入长度，设置为 -1 的时候不限制最大长度 */ + maxlength: number; + /** 指定光标与键盘的距离，单位 px 。取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 */ + cursorSpacing: number; + /** 获取焦点 */ + autoFocus: boolean; + /** 获取焦点 */ + focus: boolean; + /** 设置键盘右下角按钮的文字 */ + confirmType: "send" | "search" | "next" | "go" | "done"; + /** 点击键盘右下角按钮时是否保持键盘不收起 */ + confirmHold: boolean; + /** 指定focus时的光标位置 */ + cursor: number; + /** 光标起始位置，自动聚集时有效，需与selection-end搭配使用 */ + selectionStart: number; + /** 光标结束位置，自动聚集时有效，需与selection-satrt搭配使用 */ + selectionEnd: number; + /** 键盘弹起时，是否自动上推页面 */ + adjustPosition: boolean; + }, + {} +>; /** 用来改进表单组件的可用性，使用for属性找到对应的id，或者将控件放在该标签下，当点击时，就会触发对应的控件 */ -type TLabel = TComponent<{ - /** 是否禁用。 */ - disabled: boolean; - /** 绑定控件的 id */ - for: string; -}, {}>; +type TLabel = TComponent< + { + /** 是否禁用。 */ + disabled: boolean; + /** 绑定控件的 id */ + for: string; + }, + {} +>; /** 从底部弹起的滚动选择器，现支持五种选择器，通过mode来区分，分别是普通选择器，多列选择器，时间选择器，日期选择器，省市区选择器，默认是普通选择器。 */ -type TPicker = TComponent<{ - /** 是否禁用。 */ - disabled: boolean; - /** selector 普通选择器, multiSelector 多列选择器, time 时间选择器, date 日期选择器, region 省市区选择器 */ - mode: 'selector' | 'multiSelector' | 'time' | 'date' | 'region'; - /** mode为 selector 或 multiSelector 时，range 有效 */ - range: any[]; - /** 当 range 是一个 Object Array 时，通过 range-key 来指定 Object 中 key 的值作为选择器显示内容 */ - rangeKey: string; - /** radio当前取值 */ - value: number; - /** mode为time：表示有效时间范围的开始，字符串格式为"hh:mm"；mode为date：表示有效日期范围的开始，字符串格式为"YYYY-MM-DD" */ - start: string; - /** mode为time：表示有效时间范围的结束，字符串格式为"hh:mm"；mode为date：表示有效日期范围的结束，字符串格式为"YYYY-MM-DD" */ - end: string; - /** 有效值 year,month,day，表示选择器的粒度 */ - fields: 'year' | 'month' | 'day'; - /** 可为每一列的顶部添加一个自定义的项 */ - customItem: string; -}, {}>; +type TPicker = TComponent< + { + /** 是否禁用。 */ + disabled: boolean; + /** selector 普通选择器, multiSelector 多列选择器, time 时间选择器, date 日期选择器, region 省市区选择器 */ + mode: "selector" | "multiSelector" | "time" | "date" | "region"; + /** mode为 selector 或 multiSelector 时，range 有效 */ + range: any[]; + /** 当 range 是一个 Object Array 时，通过 range-key 来指定 Object 中 key 的值作为选择器显示内容 */ + rangeKey: string; + /** radio当前取值 */ + value: number; + /** mode为time：表示有效时间范围的开始，字符串格式为"hh:mm"；mode为date：表示有效日期范围的开始，字符串格式为"YYYY-MM-DD" */ + start: string; + /** mode为time：表示有效时间范围的结束，字符串格式为"hh:mm"；mode为date：表示有效日期范围的结束，字符串格式为"YYYY-MM-DD" */ + end: string; + /** 有效值 year,month,day，表示选择器的粒度 */ + fields: "year" | "month" | "day"; + /** 可为每一列的顶部添加一个自定义的项 */ + customItem: string; + }, + {} +>; /** 嵌入页面的滚动选择器 */ -type TPickerView = TComponent<{ - /** 是否禁用。 */ - disabled: boolean; - /** radio当前取值 */ - value: number; - /** 设置选择器中间选中框的样式 */ - indicatorStyle: string; - /** 设置选择器中间选中框的类名 */ - indicatorClass: string; - /** 设置蒙层的样式 */ - maskStyle: string; - /** 设置蒙层的类名 */ - maskClass: string; -}, {}>; +type TPickerView = TComponent< + { + /** 是否禁用。 */ + disabled: boolean; + /** radio当前取值 */ + value: number; + /** 设置选择器中间选中框的样式 */ + indicatorStyle: string; + /** 设置选择器中间选中框的类名 */ + indicatorClass: string; + /** 设置蒙层的样式 */ + maskStyle: string; + /** 设置蒙层的类名 */ + maskClass: string; + }, + {} +>; /** 单项选择器，内部由多个 radio 组成 */ -type TRadioGroup = TComponent<{ - /** 是否禁用。 */ - disabled: boolean; -}, {}>; +type TRadioGroup = TComponent< + { + /** 是否禁用。 */ + disabled: boolean; + }, + {} +>; /** 单选项目 */ -type TRadio = TComponent<{ - /** 是否禁用。 */ - disabled: boolean; - /** radio当前取值 */ - value: number; - /** 是否选中 */ - checked: boolean; - /** switch 的颜色，同 css 的 color */ - color: string; -}, {}>; +type TRadio = TComponent< + { + /** 是否禁用。 */ + disabled: boolean; + /** radio当前取值 */ + value: number; + /** 是否选中 */ + checked: boolean; + /** switch 的颜色，同 css 的 color */ + color: string; + }, + {} +>; /** 滑动选择器 */ -type TSlider = TComponent<{ - /** 是否禁用。 */ - disabled: boolean; - /** radio 最小值 */ - min: number; - /** radio最大值 */ - max: number; - /** radio步长，取值必须大于 0，并且可被(max - min)整除 */ - step: number; - /** radio当前取值 */ - value: number; - /** switch 的颜色，同 css 的 color */ - color: string; - /** radio已选择的颜色 */ - selectColor: string; - /** radio已选择的颜色 */ - activeColor: string; - /** radio背景条的颜色 */ - backgroundColor: string; - /** radio滑块的大小，取值范围为 12 - 28 */ - blockSize: number; - /** 滑块颜色 */ - blockColor: string; - /** 是否显示当前 value */ - showValue: boolean; -}, {}>; +type TSlider = TComponent< + { + /** 是否禁用。 */ + disabled: boolean; + /** radio 最小值 */ + min: number; + /** radio最大值 */ + max: number; + /** radio步长，取值必须大于 0，并且可被(max - min)整除 */ + step: number; + /** radio当前取值 */ + value: number; + /** switch 的颜色，同 css 的 color */ + color: string; + /** radio已选择的颜色 */ + selectColor: string; + /** radio已选择的颜色 */ + activeColor: string; + /** radio背景条的颜色 */ + backgroundColor: string; + /** radio滑块的大小，取值范围为 12 - 28 */ + blockSize: number; + /** 滑块颜色 */ + blockColor: string; + /** 是否显示当前 value */ + showValue: boolean; + }, + {} +>; /** 开关选择器 */ -type TSwitch = TComponent<{ - /** 是否选中 */ - checked: boolean; - /** 开放数据类型 */ - type: string; - /** switch 的颜色，同 css 的 color */ - color: string; - /** 是否禁用。 */ - disabled: boolean; -}, {}>; +type TSwitch = TComponent< + { + /** 是否选中 */ + checked: boolean; + /** 开放数据类型 */ + type: string; + /** switch 的颜色，同 css 的 color */ + color: string; + /** 是否禁用。 */ + disabled: boolean; + }, + {} +>; /** 多行输入框 */ -type TTextarea = TComponent<{ - /** radio当前取值 */ - value: number; - /** 提示信息。 */ - placeholder: string; - /** 指定 placeholder 的样式 */ - placeholderStyle: string; - /** 指定 placeholder 的样式类 */ - placeholderClass: string; - /** 最大输入长度，设置为 -1 的时候不限制最大长度 */ - maxlength: number; - /** 获取焦点 */ - autoFocus: boolean; - /** 获取焦点 */ - focus: boolean; - /** 指定focus时的光标位置 */ - cursor: number; - /** 设置键盘右下角按钮的文字 */ - confirmType: 'send' | 'search' | 'next' | 'go' | 'done'; - /** 是否自动增高，设置auto-height时，style.height不生效 */ - autoHeight: boolean; - /** 如果 textarea 是在一个 position:fixed 的区域，需要显示指定属性 fixed 为 true */ - fixed: boolean; - /** 指定光标与键盘的距离，单位 px 。取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 */ - cursorSpacing: number; - /** 是否显示键盘上方带有”完成“按钮那一栏 */ - showConfirmBar: boolean; - /** 光标起始位置，自动聚集时有效，需与selection-end搭配使用 */ - selectionStart: number; - /** 光标结束位置，自动聚集时有效，需与selection-satrt搭配使用 */ - selectionEnd: number; - /** 键盘弹起时，是否自动上推页面 */ - adjustPosition: boolean; -}, {}>; +type TTextarea = TComponent< + { + /** radio当前取值 */ + value: number; + /** 提示信息。 */ + placeholder: string; + /** 指定 placeholder 的样式 */ + placeholderStyle: string; + /** 指定 placeholder 的样式类 */ + placeholderClass: string; + /** 最大输入长度，设置为 -1 的时候不限制最大长度 */ + maxlength: number; + /** 获取焦点 */ + autoFocus: boolean; + /** 获取焦点 */ + focus: boolean; + /** 指定focus时的光标位置 */ + cursor: number; + /** 设置键盘右下角按钮的文字 */ + confirmType: "send" | "search" | "next" | "go" | "done"; + /** 是否自动增高，设置auto-height时，style.height不生效 */ + autoHeight: boolean; + /** 如果 textarea 是在一个 position:fixed 的区域，需要显示指定属性 fixed 为 true */ + fixed: boolean; + /** 指定光标与键盘的距离，单位 px 。取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 */ + cursorSpacing: number; + /** 是否显示键盘上方带有”完成“按钮那一栏 */ + showConfirmBar: boolean; + /** 光标起始位置，自动聚集时有效，需与selection-end搭配使用 */ + selectionStart: number; + /** 光标结束位置，自动聚集时有效，需与selection-satrt搭配使用 */ + selectionEnd: number; + /** 键盘弹起时，是否自动上推页面 */ + adjustPosition: boolean; + }, + {} +>; /** 页面链接 */ -type TNavigator = TComponent<{ - /** 在哪个目标上发生跳转，默认当前应用 */ - target: string; - /** 推流地址。目前仅支持 flv, rtmp 格式 */ - url: string; - /** 跳转方式 */ - openType: 'navigate' | 'redirect' | 'switchTab' | 'reLaunch' | 'navigateBack'; - /** 当 open-type 为 navigateBack 时有效，表示回退的层数 */ - delta: number; - /** 当target="miniProgram"时有效，要打开的小程序 appId */ - appId: string; - /** 当target="miniProgram"时有效，打开的页面路径，如果为空则打开首页 */ - path: string; - /** 当target="miniProgram"时有效，需要传递给目标应用的数据，目标应用可在 App.onLaunch()，App.onShow() 中获取到这份数据 */ - extraData: Record; - /** 当target="miniProgram"时有效，要打开的小程序版本，有效值 develop（开发版），trial（体验版），release（正式版），仅在当前小程序为开发版或体验版时此参数有效；如果当前小程序是体验版或正式版，则打开的小程序必定是正式版 */ - version: string; - /** 当 open-type="navigateTo" 或 open-type="navigateBack" 时有效，窗口的显示/关闭的动画类型。 */ - animationType: 'auto' | 'none' | 'slide-in-right' | 'slide-in-left' | 'slide-in-top' | 'slide-in-bottom' | 'fade-in' | 'zoom-out' | 'zoom-fade-out' | 'pop-in' | 'slide-out-right' | 'slide-out-left' | 'slide-out-top' | 'slide-out-bottom' | 'fade-out' | 'zoom-in' | 'zoom-fade-in' | 'pop-out'; - /** 当 open-type="navigateTo" 或 open-type="navigateBack" 时有效，窗口的显示/关闭动画的持续时间。 */ - animationDuration: number; - /** 指定按下去的样式类。当 hover-class="none" 时，没有点击态效果 */ - hoverClass: string; - /** 指定是否阻止本节点的祖先节点出现点击态 */ - hoverStopPropagation: boolean; - /** 按住后多久出现点击态，单位毫秒 */ - hoverStartTime: number; - /** 手指松开后点击态保留时间，单位毫秒 */ - hoverStayTime: number; -}, {}>; +type TNavigator = TComponent< + { + /** 在哪个目标上发生跳转，默认当前应用 */ + target: string; + /** 推流地址。目前仅支持 flv, rtmp 格式 */ + url: string; + /** 跳转方式 */ + openType: + | "navigate" + | "redirect" + | "switchTab" + | "reLaunch" + | "navigateBack"; + /** 当 open-type 为 navigateBack 时有效，表示回退的层数 */ + delta: number; + /** 当target="miniProgram"时有效，要打开的小程序 appId */ + appId: string; + /** 当target="miniProgram"时有效，打开的页面路径，如果为空则打开首页 */ + path: string; + /** 当target="miniProgram"时有效，需要传递给目标应用的数据，目标应用可在 App.onLaunch()，App.onShow() 中获取到这份数据 */ + extraData: Record; + /** 当target="miniProgram"时有效，要打开的小程序版本，有效值 develop（开发版），trial（体验版），release（正式版），仅在当前小程序为开发版或体验版时此参数有效；如果当前小程序是体验版或正式版，则打开的小程序必定是正式版 */ + version: string; + /** 当 open-type="navigateTo" 或 open-type="navigateBack" 时有效，窗口的显示/关闭的动画类型。 */ + animationType: + | "auto" + | "none" + | "slide-in-right" + | "slide-in-left" + | "slide-in-top" + | "slide-in-bottom" + | "fade-in" + | "zoom-out" + | "zoom-fade-out" + | "pop-in" + | "slide-out-right" + | "slide-out-left" + | "slide-out-top" + | "slide-out-bottom" + | "fade-out" + | "zoom-in" + | "zoom-fade-in" + | "pop-out"; + /** 当 open-type="navigateTo" 或 open-type="navigateBack" 时有效，窗口的显示/关闭动画的持续时间。 */ + animationDuration: number; + /** 指定按下去的样式类。当 hover-class="none" 时，没有点击态效果 */ + hoverClass: string; + /** 指定是否阻止本节点的祖先节点出现点击态 */ + hoverStopPropagation: boolean; + /** 按住后多久出现点击态，单位毫秒 */ + hoverStartTime: number; + /** 手指松开后点击态保留时间，单位毫秒 */ + hoverStayTime: number; + }, + {} +>; /** 音频 */ -type TAudio = TComponent<{ - /** 是否循环播放 */ - loop: boolean; - /** webview 指向网页的链接 */ - src: string | string; - /** 控件 */ - controls: any[]; - /** 视频封面的图片网络资源地址，如果 controls 属性值为 false 则设置 poster 无效 */ - poster: string; - /** 默认控件上的音频名字，如果 controls 属性值为 false 则设置 name 无效 */ - name: string; - /** 默认控件上的作者名字，如果 controls 属性值为 false 则设置 author 无效 */ - author: string; -}, {}>; +type TAudio = TComponent< + { + /** 是否循环播放 */ + loop: boolean; + /** webview 指向网页的链接 */ + src: string | string; + /** 控件 */ + controls: any[]; + /** 视频封面的图片网络资源地址，如果 controls 属性值为 false 则设置 poster 无效 */ + poster: string; + /** 默认控件上的音频名字，如果 controls 属性值为 false 则设置 name 无效 */ + name: string; + /** 默认控件上的作者名字，如果 controls 属性值为 false 则设置 author 无效 */ + author: string; + }, + {} +>; /** 图片 */ -type TImage = TComponent<{ - /** 是否循环播放 */ - loop: boolean; - /** webview 指向网页的链接 */ - src: string | string; - /** 图片裁剪、缩放的模式 */ - mode: 'scaleToFill' | 'aspectFit' | 'aspectFill' | 'widthFix' | 'heightFix' | 'top' | 'bottom' | 'center' | 'left' | 'right' | 'top left' | 'top right' | 'bottom left' | 'bottom right'; - /** 图片懒加载。只针对page与scroll-view下的image有效 */ - lazyLoad: boolean; - /** 图片显示动画效果 */ - fadeShow: boolean; - /** 默认不解析 webP 格式，只支持网络资源 */ - webp: boolean; - /** 开启长按图片显示识别小程序码菜单 */ - showMenuByLongpress: boolean; -}, {}>; +type TImage = TComponent< + { + /** 是否循环播放 */ + loop: boolean; + /** webview 指向网页的链接 */ + src: string | string; + /** 图片裁剪、缩放的模式 */ + mode: + | "scaleToFill" + | "aspectFit" + | "aspectFill" + | "widthFix" + | "heightFix" + | "top" + | "bottom" + | "center" + | "left" + | "right" + | "top left" + | "top right" + | "bottom left" + | "bottom right"; + /** 图片懒加载。只针对page与scroll-view下的image有效 */ + lazyLoad: boolean; + /** 图片显示动画效果 */ + fadeShow: boolean; + /** 默认不解析 webP 格式，只支持网络资源 */ + webp: boolean; + /** 开启长按图片显示识别小程序码菜单 */ + showMenuByLongpress: boolean; + }, + {} +>; /** 视频 */ -type TVideo = TComponent<{ - /** 是否循环播放 */ - loop: boolean; - /** webview 指向网页的链接 */ - src: string | string; - /** 指定视频初始播放位置 */ - initialTime: number; - /** 指定视频长度 */ - duration: number; - /** 控件 */ - controls: any[]; - /** 弹幕列表 */ - danmuList: any[]; - /** 是否显示弹幕按钮，只在初始化时有效，不能动态变更 */ - danmuBtn: boolean; - /** 是否展示弹幕，只在初始化时有效，不能动态变更 */ - enableDanmu: boolean; - /** 自动播放 */ - autoplay: boolean; - /** 是否静音 */ - muted: boolean; - /** 在非全屏模式下，是否开启亮度与音量调节手势 */ - pageGesture: boolean; - /** movable-view 的移动方向。 */ - direction: 'all' | 'vertical' | 'horizontal' | 'none'; - /** 若不设置，宽度大于240时才会显示 */ - showProgress: boolean; - /** 是否显示全屏按钮 */ - showFullscreenBtn: boolean; - /** 是否显示视频底部控制栏的播放按钮 */ - showPlayBtn: boolean; - /** 是否显示视频中间的播放按钮 */ - showCenterPlayBtn: boolean; - /** 是否开启控制进度的手势 */ - enableProgressGesture: boolean; - /** 当视频大小与 video 容器大小不一致时，视频的表现形式。 */ - objectFit: 'contain' | 'fill' | 'cover'; - /** 视频封面的图片网络资源地址，如果 controls 属性值为 false 则设置 poster 无效 */ - poster: string; - /** 是否显示静音按钮 */ - showMuteBtn: boolean; - /** 视频的标题，全屏时在顶部展示 */ - title: string; - /** 播放按钮的位置 */ - playBtnPosition: string; - /** 是否开启播放手势，即双击切换播放、暂停 */ - enablePlayGesture: boolean; - /** 当跳转到其它小程序页面时，是否自动暂停本页面的视频 */ - autoPauseIfNavigate: boolean; - /** 当跳转到其它微信原生页面时，是否自动暂停本页面的视频 */ - autoPauseIfOpenNative: boolean; - /** 在非全屏模式下，是否开启亮度与音量调节手势（同 page-gesture） */ - vslideGesture: boolean; - /** 在全屏模式下，是否开启亮度与音量调节手势 */ - vslideGestureInFullscreen: boolean; - /** 视频前贴广告单元ID */ - adUnitId: string; - /** 用于给搜索等场景作为视频封面展示，建议使用无播放 icon 的视频封面图，只支持网络地址 */ - posterForCrawler: string; - /** 解码器选择 */ - codec: string; - /** 是否对 http、https 视频源开启本地缓存 */ - httpCache: boolean; - /** 播放策略 */ - playStrategy: number; -}, {}>; +type TVideo = TComponent< + { + /** 是否循环播放 */ + loop: boolean; + /** webview 指向网页的链接 */ + src: string | string; + /** 指定视频初始播放位置 */ + initialTime: number; + /** 指定视频长度 */ + duration: number; + /** 控件 */ + controls: any[]; + /** 弹幕列表 */ + danmuList: any[]; + /** 是否显示弹幕按钮，只在初始化时有效，不能动态变更 */ + danmuBtn: boolean; + /** 是否展示弹幕，只在初始化时有效，不能动态变更 */ + enableDanmu: boolean; + /** 自动播放 */ + autoplay: boolean; + /** 是否静音 */ + muted: boolean; + /** 在非全屏模式下，是否开启亮度与音量调节手势 */ + pageGesture: boolean; + /** movable-view 的移动方向。 */ + direction: "all" | "vertical" | "horizontal" | "none"; + /** 若不设置，宽度大于240时才会显示 */ + showProgress: boolean; + /** 是否显示全屏按钮 */ + showFullscreenBtn: boolean; + /** 是否显示视频底部控制栏的播放按钮 */ + showPlayBtn: boolean; + /** 是否显示视频中间的播放按钮 */ + showCenterPlayBtn: boolean; + /** 是否开启控制进度的手势 */ + enableProgressGesture: boolean; + /** 当视频大小与 video 容器大小不一致时，视频的表现形式。 */ + objectFit: "contain" | "fill" | "cover"; + /** 视频封面的图片网络资源地址，如果 controls 属性值为 false 则设置 poster 无效 */ + poster: string; + /** 是否显示静音按钮 */ + showMuteBtn: boolean; + /** 视频的标题，全屏时在顶部展示 */ + title: string; + /** 播放按钮的位置 */ + playBtnPosition: string; + /** 是否开启播放手势，即双击切换播放、暂停 */ + enablePlayGesture: boolean; + /** 当跳转到其它小程序页面时，是否自动暂停本页面的视频 */ + autoPauseIfNavigate: boolean; + /** 当跳转到其它微信原生页面时，是否自动暂停本页面的视频 */ + autoPauseIfOpenNative: boolean; + /** 在非全屏模式下，是否开启亮度与音量调节手势（同 page-gesture） */ + vslideGesture: boolean; + /** 在全屏模式下，是否开启亮度与音量调节手势 */ + vslideGestureInFullscreen: boolean; + /** 视频前贴广告单元ID */ + adUnitId: string; + /** 用于给搜索等场景作为视频封面展示，建议使用无播放 icon 的视频封面图，只支持网络地址 */ + posterForCrawler: string; + /** 解码器选择 */ + codec: string; + /** 是否对 http、https 视频源开启本地缓存 */ + httpCache: boolean; + /** 播放策略 */ + playStrategy: number; + }, + {} +>; /** 地图 */ -type TMap = TComponent<{ - /** 中心经度 */ - longitude: number; - /** 中心纬度 */ - latitude: number; - /** 是否支持双指缩放，默认缩放手势生效区域是在 movable-view 内。 */ - scale: boolean; - /** 标记点 */ - markers: any[]; - /** 即将移除，请使用 markers */ - covers: any[]; - /** 路线 */ - polyline: any[]; - /** 圆 */ - circles: any[]; - /** 控件 */ - controls: any[]; - /** 缩放视野以包含所有给定的坐标点 */ - includePoints: any[]; - /** 显示带有方向的当前定位点 */ - showLocation: boolean; -}, {}>; +type TMap = TComponent< + { + /** 中心经度 */ + longitude: number; + /** 中心纬度 */ + latitude: number; + /** 是否支持双指缩放，默认缩放手势生效区域是在 movable-view 内。 */ + scale: boolean; + /** 标记点 */ + markers: any[]; + /** 即将移除，请使用 markers */ + covers: any[]; + /** 路线 */ + polyline: any[]; + /** 圆 */ + circles: any[]; + /** 控件 */ + controls: any[]; + /** 缩放视野以包含所有给定的坐标点 */ + includePoints: any[]; + /** 显示带有方向的当前定位点 */ + showLocation: boolean; + }, + {} +>; /** 画布 */ -type TCanvas = TComponent<{ - /** canvas 组件的唯一标识符 */ - canvasId: string; - /** 当在 canvas 中移动时且有绑定手势事件时，禁止屏幕滚动以及下拉刷新 */ - disableScroll: boolean; -}, {}>; +type TCanvas = TComponent< + { + /** canvas 组件的唯一标识符 */ + canvasId: string; + /** 当在 canvas 中移动时且有绑定手势事件时，禁止屏幕滚动以及下拉刷新 */ + disableScroll: boolean; + }, + {} +>; /** 承载网页的容器 */ -type TWebView = TComponent<{ - /** webview 指向网页的链接 */ - src: string | string; - /** webview 的样式 */ - webviewStyles: Record | boolean; -}, {}>; +type TWebView = TComponent< + { + /** webview 指向网页的链接 */ + src: string | string; + /** webview 的样式 */ + webviewStyles: Record | boolean; + }, + {} +>; /** 覆盖在原生组件之上的文本视图，可覆盖的原生组件包括map、video、canvas、camera，只支持嵌套cover-view、cover-image */ -type TCoverView = TComponent<{ - -}, {}>; +type TCoverView = TComponent<{}, {}>; /** 覆盖在原生组件之上的图片视图，可覆盖的原生组件同cover-view，支持嵌套在cover-view里。 */ -type TCoverImage = TComponent<{ - /** webview 指向网页的链接 */ - src: string | string; -}, {}>; +type TCoverImage = TComponent< + { + /** webview 指向网页的链接 */ + src: string | string; + }, + {} +>; /** 图标 */ -type TIcon = TComponent<{ - /** 开放数据类型 */ - type: string; - /** 按钮的大小 */ - size: 'default' | 'mini'; - /** switch 的颜色，同 css 的 color */ - color: string; -}, {}>; +type TIcon = TComponent< + { + /** 开放数据类型 */ + type: string; + /** 按钮的大小 */ + size: "default" | "mini"; + /** switch 的颜色，同 css 的 color */ + color: string; + }, + {} +>; /** 仅可放置于 picker-view 中，其孩子节点的高度会自动设置成与picker-view的选中框的高度一致 */ -type TPickerViewColumn = TComponent<{ - /** 是否禁用。 */ - disabled: boolean; -}, {}>; +type TPickerViewColumn = TComponent< + { + /** 是否禁用。 */ + disabled: boolean; + }, + {} +>; /** 相机组件 */ -type TCamera = TComponent<{ - /** 前置或后置，值为front, back */ - flash: 'back' | 'front'; - /** 闪光灯，值为auto, on, off */ - devicePosition: string; -}, {}>; +type TCamera = TComponent< + { + /** 前置或后置，值为front, back */ + flash: "back" | "front"; + /** 闪光灯，值为auto, on, off */ + devicePosition: string; + }, + {} +>; /** 实时音视频播放 */ -type TLivePlayer = TComponent<{ - /** webview 指向网页的链接 */ - src: string | string; - /** live（直播），RTC（实时通话，该模式时延更低） */ - mode: 'live' | 'RTC'; - /** 自动播放 */ - autoplay: boolean; - /** 是否静音 */ - muted: boolean; - /** 画面方向，可选值有 vertical，horizontal */ - orientation: 'vertical' | 'horizontal'; - /** 填充模式，可选值有 contain，fillCrop */ - objectFit: 'contain' | 'fillCrop'; - /** 进入后台时是否静音 */ - backgroundMute: boolean; - /** 最小缓冲区，单位s */ - minCache: string; - /** 最大缓冲区，单位s */ - maxCache: string; -}, {}>; +type TLivePlayer = TComponent< + { + /** webview 指向网页的链接 */ + src: string | string; + /** live（直播），RTC（实时通话，该模式时延更低） */ + mode: "live" | "RTC"; + /** 自动播放 */ + autoplay: boolean; + /** 是否静音 */ + muted: boolean; + /** 画面方向，可选值有 vertical，horizontal */ + orientation: "vertical" | "horizontal"; + /** 填充模式，可选值有 contain，fillCrop */ + objectFit: "contain" | "fillCrop"; + /** 进入后台时是否静音 */ + backgroundMute: boolean; + /** 最小缓冲区，单位s */ + minCache: string; + /** 最大缓冲区，单位s */ + maxCache: string; + }, + {} +>; /** 实时音视频录制 */ -type TLivePusher = TComponent<{ - /** 推流地址。目前仅支持 flv, rtmp 格式 */ - url: string; - /** 推流视频模式，可取值：SD（标清）, HD（高清）, FHD（超清）。 */ - mode: 'SD' | 'HD' | 'FHD'; - /** 自动推流 */ - autopush: boolean; - /** 是否静音 */ - muted: boolean; - /** 开启摄像头 */ - enableCamera: boolean; - /** 获取焦点 */ - autoFocus: boolean; - /** 画面方向，可选值有 vertical，horizontal */ - orientation: 'vertical' | 'horizontal'; - /** 美颜 */ - beauty: number; - /** 美白 */ - aspect: number; - /** 最小码率 */ - minBitrate: string; - /** 最大码率 */ - maxBitrate: string; - /** 进入后台时推流的等待画面 */ - waitingImage: string; - /** 等待画面资源的MD5值 */ - waitingImageMd5: string; - /** 进入后台时是否静音 */ - backgroundMute: boolean; -}, {}>; +type TLivePusher = TComponent< + { + /** 推流地址。目前仅支持 flv, rtmp 格式 */ + url: string; + /** 推流视频模式，可取值：SD（标清）, HD（高清）, FHD（超清）。 */ + mode: "SD" | "HD" | "FHD"; + /** 自动推流 */ + autopush: boolean; + /** 是否静音 */ + muted: boolean; + /** 开启摄像头 */ + enableCamera: boolean; + /** 获取焦点 */ + autoFocus: boolean; + /** 画面方向，可选值有 vertical，horizontal */ + orientation: "vertical" | "horizontal"; + /** 美颜 */ + beauty: number; + /** 美白 */ + aspect: number; + /** 最小码率 */ + minBitrate: string; + /** 最大码率 */ + maxBitrate: string; + /** 进入后台时推流的等待画面 */ + waitingImage: string; + /** 等待画面资源的MD5值 */ + waitingImageMd5: string; + /** 进入后台时是否静音 */ + backgroundMute: boolean; + }, + {} +>; /** 用于展示微信开放的数据 */ -type TOpenData = TComponent<{ - /** 开放数据类型 */ - type: string; - /** 当 type="groupName" 时生效, 群id */ - openGid: string; - /** */ - lang: 'ts'; -}, {}>; +type TOpenData = TComponent< + { + /** 开放数据类型 */ + type: string; + /** 当 type="groupName" 时生效, 群id */ + openGid: string; + /** */ + lang: "ts"; + }, + {} +>; /** 广告 */ -type TAd = TComponent<{ - /** App广告位id，在uni-AD官网申请广告位 */ - adpid: string; -}, {}>; +type TAd = TComponent< + { + /** App广告位id，在uni-AD官网申请广告位 */ + adpid: string; + }, + {} +>; /** Draw 信息流广告 */ -type TAdDraw = TComponent<{ - /** App广告位id，在uni-AD官网申请广告位 */ - adpid: string; -}, {}>; +type TAdDraw = TComponent< + { + /** App广告位id，在uni-AD官网申请广告位 */ + adpid: string; + }, + {} +>; /** 页面导航条配置节点 */ -type TNavigationBar = TComponent<{ - /** 视频的标题，全屏时在顶部展示 */ - title: string; - /** 标题icon */ - titleIcon: boolean; - /** 标题icon圆角 */ - titleIconRadius: boolean; - /** */ - subtitleText: boolean; - /** */ - subtitleSize: boolean; - /** */ - subtitleColor: boolean; - /** */ - subtitleOverflow: boolean; - /** */ - titleAlign: boolean; - /** */ - backgroundImage: boolean; - /** */ - backgroundRepeat: boolean; - /** */ - blurEffect: boolean; - /** 是否在导航条显示 loading 加载提示 */ - loading: boolean; - /** 导航条前景颜色值，包括按钮、标题、状态栏的颜色，仅支持 #ffffff 和 #000000 */ - frontColor: boolean; - /** 窗口的背景色，必须为十六进制颜色值 */ - backgroundColor: string; - /** 改变导航栏颜色时的动画时长，默认为 0 （即没有动画效果） */ - colorAnimationDuration: boolean; - /** 改变导航栏颜色时的动画方式，支持 linear 、 easeIn 、 easeOut 和 easeInOut */ - colorAnimationTimingFunc: boolean; -}, {}>; +type TNavigationBar = TComponent< + { + /** 视频的标题，全屏时在顶部展示 */ + title: string; + /** 标题icon */ + titleIcon: boolean; + /** 标题icon圆角 */ + titleIconRadius: boolean; + /** */ + subtitleText: boolean; + /** */ + subtitleSize: boolean; + /** */ + subtitleColor: boolean; + /** */ + subtitleOverflow: boolean; + /** */ + titleAlign: boolean; + /** */ + backgroundImage: boolean; + /** */ + backgroundRepeat: boolean; + /** */ + blurEffect: boolean; + /** 是否在导航条显示 loading 加载提示 */ + loading: boolean; + /** 导航条前景颜色值，包括按钮、标题、状态栏的颜色，仅支持 #ffffff 和 #000000 */ + frontColor: boolean; + /** 窗口的背景色，必须为十六进制颜色值 */ + backgroundColor: string; + /** 改变导航栏颜色时的动画时长，默认为 0 （即没有动画效果） */ + colorAnimationDuration: boolean; + /** 改变导航栏颜色时的动画方式，支持 linear 、 easeIn 、 easeOut 和 easeInOut */ + colorAnimationTimingFunc: boolean; + }, + {} +>; /** 自定义tabBar */ -type TCustomTabBar = TComponent<{ - /** movable-view 的移动方向。 */ - direction: 'all' | 'vertical' | 'horizontal' | 'none'; - /** 是否显示icon */ - showIcon: boolean; - /** 选中的tabBar选项索引值 */ - selected: number; -}, {}>; +type TCustomTabBar = TComponent< + { + /** movable-view 的移动方向。 */ + direction: "all" | "vertical" | "horizontal" | "none"; + /** 是否显示icon */ + showIcon: boolean; + /** 选中的tabBar选项索引值 */ + selected: number; + }, + {} +>; /** 自定义tabBar */ -type TPageMeta = TComponent<{ - /** 下拉背景字体、loading 图的样式，仅支持 dark 和 light */ - backgroundTextStyle: string; - /** 窗口的背景色，必须为十六进制颜色值 */ - backgroundColor: string; - /** 顶部窗口的背景色，必须为十六进制颜色值，仅 iOS 支持 */ - backgroundColorTop: string; - /** 底部窗口的背景色，必须为十六进制颜色值，仅 iOS 支持 */ - backgroundColorBottom: string; - /** 滚动位置，可以使用 px 或者 rpx 为单位，在被设置时，页面会滚动到对应位置 */ - scrollTop: string; - /** 滚动动画时长 */ - scrollDuration: number; - /** 页面根节点样式，页面根节点是所有页面节点的祖先节点，相当于 HTML 中的 body 节点 */ - pageStyle: string; - /** 页面的根字体大小，页面中的所有 rem 单位，将使用这个字体大小作为参考值，即 1rem 等于这个字体大小 */ - rootFontSize: string; - /** */ - enablePullDownRefresh: boolean; -}, {}>; +type TPageMeta = TComponent< + { + /** 下拉背景字体、loading 图的样式，仅支持 dark 和 light */ + backgroundTextStyle: string; + /** 窗口的背景色，必须为十六进制颜色值 */ + backgroundColor: string; + /** 顶部窗口的背景色，必须为十六进制颜色值，仅 iOS 支持 */ + backgroundColorTop: string; + /** 底部窗口的背景色，必须为十六进制颜色值，仅 iOS 支持 */ + backgroundColorBottom: string; + /** 滚动位置，可以使用 px 或者 rpx 为单位，在被设置时，页面会滚动到对应位置 */ + scrollTop: string; + /** 滚动动画时长 */ + scrollDuration: number; + /** 页面根节点样式，页面根节点是所有页面节点的祖先节点，相当于 HTML 中的 body 节点 */ + pageStyle: string; + /** 页面的根字体大小，页面中的所有 rem 单位，将使用这个字体大小作为参考值，即 1rem 等于这个字体大小 */ + rootFontSize: string; + /** */ + enablePullDownRefresh: boolean; + }, + {} +>; /** 富文本编辑器，可以对图片、文字进行编辑。 */ -type TEditor = TComponent<{ - /** 设置编辑器为只读。 */ - readOnly: boolean; - /** 提示信息。 */ - placeholder: string; - /** 点击图片时显示图片大小控件。 */ - showImgSize: boolean; - /** 点击图片时显示工具栏控件。 */ - showImgToolbar: boolean; - /** 点击图片时显示修改尺寸控件。 */ - showImgResize: string; -}, {}>; +type TEditor = TComponent< + { + /** 设置编辑器为只读。 */ + readOnly: boolean; + /** 提示信息。 */ + placeholder: string; + /** 点击图片时显示图片大小控件。 */ + showImgSize: boolean; + /** 点击图片时显示工具栏控件。 */ + showImgToolbar: boolean; + /** 点击图片时显示修改尺寸控件。 */ + showImgResize: string; + }, + {} +>; /** 是一个数据库查询组件，它是对uni-clientdb的js库的再封装。 */ -type TUnicloudDb = TComponent<{ - /** 表名 */ - collection: string | string; - /** 查询字段，多个字段用 `,` 分割 */ - field: string | string; - /** 查询条件 */ - where: string | string; - /** 云端执行数据库查询的前或后，触发某个action函数操作，进行预处理或后处理 */ - action: string | string; - /** 排序字段及正序倒叙设置 */ - orderby: string; - /** 对数据进行分组 */ - groupby: string; - /** 对数据进行分组统计 */ - groupField: string; - /** 是否对数据查询结果中重复的记录进行去重 */ - distinct: boolean; - /** add 多次查询的集合, replace 当前查询的集合 */ - pageData: 'add' | 'replace'; - /** 当前页 */ - pageCurrent: number; - /** 每页数据数量 */ - pageSize: number; - /** 指定查询结果是否返回数组第一条数据，默认 false。在false情况下返回的是数组，即便只有一条结果，也需要[0]的方式获取。在true下，直接返回结果数据，少一层数组 */ - getone: boolean; - /** 是否查询总数量 */ - getcount: boolean; - /** 是否查询树状结构数据 */ - gettree: boolean; - /** gettree的第一层级条件，此初始条件可以省略，不传startWith时默认从最顶级开始查询 */ - startwith: string; - /** gettree查询返回的树的最大层级。超过设定层级的节点不会返回。默认10级，最大15，最小1 */ - limitlevel: number; - /** 是否手动加载数据，默认为 false，页面onready时自动联网加载数据 */ - manual: boolean; -}, {}>; - -declare module 'vue' { +type TUnicloudDb = TComponent< + { + /** 表名 */ + collection: string | string; + /** 查询字段，多个字段用 `,` 分割 */ + field: string | string; + /** 查询条件 */ + where: string | string; + /** 云端执行数据库查询的前或后，触发某个action函数操作，进行预处理或后处理 */ + action: string | string; + /** 排序字段及正序倒叙设置 */ + orderby: string; + /** 对数据进行分组 */ + groupby: string; + /** 对数据进行分组统计 */ + groupField: string; + /** 是否对数据查询结果中重复的记录进行去重 */ + distinct: boolean; + /** add 多次查询的集合, replace 当前查询的集合 */ + pageData: "add" | "replace"; + /** 当前页 */ + pageCurrent: number; + /** 每页数据数量 */ + pageSize: number; + /** 指定查询结果是否返回数组第一条数据，默认 false。在false情况下返回的是数组，即便只有一条结果，也需要[0]的方式获取。在true下，直接返回结果数据，少一层数组 */ + getone: boolean; + /** 是否查询总数量 */ + getcount: boolean; + /** 是否查询树状结构数据 */ + gettree: boolean; + /** gettree的第一层级条件，此初始条件可以省略，不传startWith时默认从最顶级开始查询 */ + startwith: string; + /** gettree查询返回的树的最大层级。超过设定层级的节点不会返回。默认10级，最大15，最小1 */ + limitlevel: number; + /** 是否手动加载数据，默认为 false，页面onready时自动联网加载数据 */ + manual: boolean; + }, + {} +>; + +declare module "vue" { export interface GlobalComponents { Block: TBlock; View: TView; From 1fb43af0baa68cdf9a7f18c9669c0ed5ae456310 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 10:53:51 +0800 Subject: [PATCH 06/59] feat: TBlock --- index.d.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/index.d.ts b/index.d.ts index ef0818b..ff221b5 100644 --- a/index.d.ts +++ b/index.d.ts @@ -28,7 +28,11 @@ type TComponent< Readonly> >; -/** block节点 */ +/** + * @desc 包装元素，不会在页面中做任何渲染，只接受控制属性 + * @desc 支持在 template 模板中嵌套 template 和 block + * @desc 在不同的平台表现存在一定差异，推荐统一使用 template + */ type TBlock = TComponent<{}, {}>; /** 基本视图容器 */ From c96ff1d65c41fcc25d46b871d4edd6c861702582 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 10:54:05 +0800 Subject: [PATCH 07/59] feat: TView --- index.d.ts | 29 ++++++++++++++++++++++++----- 1 file changed, 24 insertions(+), 5 deletions(-) diff --git a/index.d.ts b/index.d.ts index ff221b5..3775739 100644 --- a/index.d.ts +++ b/index.d.ts @@ -35,16 +35,35 @@ type TComponent< */ type TBlock = TComponent<{}, {}>; -/** 基本视图容器 */ +/** + * @desc 视图容器 + * @desc 类似于 div，用于包裹各种元素内容 + * @desc 如果使用 nvue，包裹文字应该使用 text 组件 + */ type TView = TComponent< { - /** 指定按下去的样式类。当 hover-class="none" 时，没有点击态效果 */ + /** + * @desc 指定按下去的样式类 + * @desc 当 hover-class="none" 时，没有点击态效果 + * @desc 默认为 none + */ hoverClass: string; - /** 指定是否阻止本节点的祖先节点出现点击态 */ + /** + * @desc 指定是否阻止本节点的祖先节点出现点击态 + * @desc 默认为 false + */ hoverStopPropagation: boolean; - /** 按住后多久出现点击态，单位毫秒 */ + /** + * @desc 按住后多久出现点击态 + * @desc 单位为毫秒 + * @desc 默认为 50 + */ hoverStartTime: number; - /** 手指松开后点击态保留时间，单位毫秒 */ + /** + * @desc 手指松开后点击态保留时间 + * @desc 单位为毫秒 + * @desc 默认为 400 + */ hoverStayTime: number; }, {} From 99851b8177b6cc972813c40b276a8eb2f0c4b23e Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 11:07:29 +0800 Subject: [PATCH 08/59] chore: update deps --- package.json | 9 +- pnpm-lock.yaml | 360 +++++++++++++++++++++---------------------------- 2 files changed, 158 insertions(+), 211 deletions(-) diff --git a/package.json b/package.json index a99d1db..5ade531 100644 --- a/package.json +++ b/package.json @@ -3,11 +3,11 @@ "version": "2.0.0-beta.0", "description": "uni-app基础组件的类型提示", "typings": "uni-base-components.d.ts", - "scripts": { - "build": "ts-node src/index.ts" - }, + "scripts": {}, "keywords": [ - "uni-app" + "uni-app", + "uniapp", + "type" ], "author": { "name": "satrong", @@ -25,7 +25,6 @@ }, "devDependencies": { "@types/node": "^17.0.21", - "ts-node": "^10.5.0", "typescript": "^4.5.5" }, "files": [ diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 0cf11d8..6630ade 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -3,294 +3,242 @@ lockfileVersion: 5.4 specifiers: '@dcloudio/uni-helper-json': ^1.0.13 '@types/node': ^17.0.21 - ts-node: ^10.5.0 typescript: ^4.5.5 vue3: npm:vue@3 dependencies: '@dcloudio/uni-helper-json': 1.0.13 - vue3: /vue/3.2.37 + vue3: registry.npmjs.org/vue/3.2.37 devDependencies: '@types/node': 17.0.21 - ts-node: 10.5.0_tgseqbmpq5foykrvhuhjoqlhzq typescript: 4.5.5 packages: - /@babel/helper-validator-identifier/7.18.6: - resolution: {integrity: sha512-MmetCkz9ej86nJQV+sFCxoGGrUbU3q02kgLciwkrt9QqEB7cP39oKEY0PakknEO0Gu20SskMRi+AYZ3b1TpN9g==} + /@dcloudio/uni-helper-json/1.0.13: + resolution: {integrity: sha512-FO9Iu4zW4td3Tr+eiCDWuele2ehkJ4qxQ/UhpAMLjso+ZdWz6NagK5Syh6cdy1hoDqbxpNoqnLynuJXe81Ereg==} + dev: false + + /@types/node/17.0.21: + resolution: {integrity: sha512-DBZCJbhII3r90XbQxI8Y9IjjiiOGlZ0Hr32omXIZvwwZ7p4DMMXGrKXVyPfuoBOri9XNtL0UK69jYIBIsRX3QQ==} + dev: true + + /typescript/4.5.5: + resolution: {integrity: sha512-TCTIul70LyWe6IJWT8QSYeA54WQe8EjQFU4wY52Fasj5UKx88LNYKCgBEHcOMOrFF1rKGbD8v/xcNWVUq9SymA==} + engines: {node: '>=4.2.0'} + hasBin: true + dev: true + + registry.npmjs.org/@babel/helper-validator-identifier/7.18.6: + resolution: {integrity: sha512-MmetCkz9ej86nJQV+sFCxoGGrUbU3q02kgLciwkrt9QqEB7cP39oKEY0PakknEO0Gu20SskMRi+AYZ3b1TpN9g==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.18.6.tgz} + name: '@babel/helper-validator-identifier' + version: 7.18.6 engines: {node: '>=6.9.0'} dev: false - /@babel/parser/7.18.6: - resolution: {integrity: sha512-uQVSa9jJUe/G/304lXspfWVpKpK4euFLgGiMQFOCpM/bgcAdeoHwi/OQz23O9GK2osz26ZiXRRV9aV+Yl1O8tw==} + registry.npmjs.org/@babel/parser/7.18.6: + resolution: {integrity: sha512-uQVSa9jJUe/G/304lXspfWVpKpK4euFLgGiMQFOCpM/bgcAdeoHwi/OQz23O9GK2osz26ZiXRRV9aV+Yl1O8tw==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@babel/parser/-/parser-7.18.6.tgz} + name: '@babel/parser' + version: 7.18.6 engines: {node: '>=6.0.0'} hasBin: true dependencies: - '@babel/types': 7.18.7 + '@babel/types': registry.npmjs.org/@babel/types/7.18.7 dev: false - /@babel/types/7.18.7: - resolution: {integrity: sha512-QG3yxTcTIBoAcQmkCs+wAPYZhu7Dk9rXKacINfNbdJDNERTbLQbHGyVG8q/YGMPeCJRIhSY0+fTc5+xuh6WPSQ==} + registry.npmjs.org/@babel/types/7.18.7: + resolution: {integrity: sha512-QG3yxTcTIBoAcQmkCs+wAPYZhu7Dk9rXKacINfNbdJDNERTbLQbHGyVG8q/YGMPeCJRIhSY0+fTc5+xuh6WPSQ==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@babel/types/-/types-7.18.7.tgz} + name: '@babel/types' + version: 7.18.7 engines: {node: '>=6.9.0'} dependencies: - '@babel/helper-validator-identifier': 7.18.6 - to-fast-properties: 2.0.0 + '@babel/helper-validator-identifier': registry.npmjs.org/@babel/helper-validator-identifier/7.18.6 + to-fast-properties: registry.npmjs.org/to-fast-properties/2.0.0 dev: false - /@cspotcode/source-map-consumer/0.8.0: - resolution: {integrity: sha512-41qniHzTU8yAGbCp04ohlmSrZf8bkf/iJsl3V0dRGsQN/5GFfx+LbCSsCpp2gqrqjTVg/K6O8ycoV35JIwAzAg==} - engines: {node: '>= 12'} - dev: true - - /@cspotcode/source-map-support/0.7.0: - resolution: {integrity: sha512-X4xqRHqN8ACt2aHVe51OxeA2HjbcL4MqFqXkrmQszJ1NOUuUu5u6Vqx/0lZSVNku7velL5FC/s5uEAj1lsBMhA==} - engines: {node: '>=12'} + registry.npmjs.org/@vue/compiler-core/3.2.37: + resolution: {integrity: sha512-81KhEjo7YAOh0vQJoSmAD68wLfYqJvoiD4ulyedzF+OEk/bk6/hx3fTNVfuzugIIaTrOx4PGx6pAiBRe5e9Zmg==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.2.37.tgz} + name: '@vue/compiler-core' + version: 3.2.37 dependencies: - '@cspotcode/source-map-consumer': 0.8.0 - dev: true - - /@dcloudio/uni-helper-json/1.0.13: - resolution: {integrity: sha512-FO9Iu4zW4td3Tr+eiCDWuele2ehkJ4qxQ/UhpAMLjso+ZdWz6NagK5Syh6cdy1hoDqbxpNoqnLynuJXe81Ereg==} + '@babel/parser': registry.npmjs.org/@babel/parser/7.18.6 + '@vue/shared': registry.npmjs.org/@vue/shared/3.2.37 + estree-walker: registry.npmjs.org/estree-walker/2.0.2 + source-map: registry.npmjs.org/source-map/0.6.1 dev: false - /@tsconfig/node10/1.0.8: - resolution: {integrity: sha512-6XFfSQmMgq0CFLY1MslA/CPUfhIL919M1rMsa5lP2P097N2Wd1sSX0tx1u4olM16fLNhtHZpRhedZJphNJqmZg==} - dev: true - - /@tsconfig/node12/1.0.9: - resolution: {integrity: sha512-/yBMcem+fbvhSREH+s14YJi18sp7J9jpuhYByADT2rypfajMZZN4WQ6zBGgBKp53NKmqI36wFYDb3yaMPurITw==} - dev: true - - /@tsconfig/node14/1.0.1: - resolution: {integrity: sha512-509r2+yARFfHHE7T6Puu2jjkoycftovhXRqW328PDXTVGKihlb1P8Z9mMZH04ebyajfRY7dedfGynlrFHJUQCg==} - dev: true - - /@tsconfig/node16/1.0.2: - resolution: {integrity: sha512-eZxlbI8GZscaGS7kkc/trHTT5xgrjH3/1n2JDwusC9iahPKWMRvRjJSAN5mCXviuTGQ/lHnhvv8Q1YTpnfz9gA==} - dev: true - - /@types/node/17.0.21: - resolution: {integrity: sha512-DBZCJbhII3r90XbQxI8Y9IjjiiOGlZ0Hr32omXIZvwwZ7p4DMMXGrKXVyPfuoBOri9XNtL0UK69jYIBIsRX3QQ==} - dev: true - - /@vue/compiler-core/3.2.37: - resolution: {integrity: sha512-81KhEjo7YAOh0vQJoSmAD68wLfYqJvoiD4ulyedzF+OEk/bk6/hx3fTNVfuzugIIaTrOx4PGx6pAiBRe5e9Zmg==} + registry.npmjs.org/@vue/compiler-dom/3.2.37: + resolution: {integrity: sha512-yxJLH167fucHKxaqXpYk7x8z7mMEnXOw3G2q62FTkmsvNxu4FQSu5+3UMb+L7fjKa26DEzhrmCxAgFLLIzVfqQ==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.2.37.tgz} + name: '@vue/compiler-dom' + version: 3.2.37 dependencies: - '@babel/parser': 7.18.6 - '@vue/shared': 3.2.37 - estree-walker: 2.0.2 - source-map: 0.6.1 + '@vue/compiler-core': registry.npmjs.org/@vue/compiler-core/3.2.37 + '@vue/shared': registry.npmjs.org/@vue/shared/3.2.37 dev: false - /@vue/compiler-dom/3.2.37: - resolution: {integrity: sha512-yxJLH167fucHKxaqXpYk7x8z7mMEnXOw3G2q62FTkmsvNxu4FQSu5+3UMb+L7fjKa26DEzhrmCxAgFLLIzVfqQ==} + registry.npmjs.org/@vue/compiler-sfc/3.2.37: + resolution: {integrity: sha512-+7i/2+9LYlpqDv+KTtWhOZH+pa8/HnX/905MdVmAcI/mPQOBwkHHIzrsEsucyOIZQYMkXUiTkmZq5am/NyXKkg==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.37.tgz} + name: '@vue/compiler-sfc' + version: 3.2.37 dependencies: - '@vue/compiler-core': 3.2.37 - '@vue/shared': 3.2.37 + '@babel/parser': registry.npmjs.org/@babel/parser/7.18.6 + '@vue/compiler-core': registry.npmjs.org/@vue/compiler-core/3.2.37 + '@vue/compiler-dom': registry.npmjs.org/@vue/compiler-dom/3.2.37 + '@vue/compiler-ssr': registry.npmjs.org/@vue/compiler-ssr/3.2.37 + '@vue/reactivity-transform': registry.npmjs.org/@vue/reactivity-transform/3.2.37 + '@vue/shared': registry.npmjs.org/@vue/shared/3.2.37 + estree-walker: registry.npmjs.org/estree-walker/2.0.2 + magic-string: registry.npmjs.org/magic-string/0.25.9 + postcss: registry.npmjs.org/postcss/8.4.14 + source-map: registry.npmjs.org/source-map/0.6.1 dev: false - /@vue/compiler-sfc/3.2.37: - resolution: {integrity: sha512-+7i/2+9LYlpqDv+KTtWhOZH+pa8/HnX/905MdVmAcI/mPQOBwkHHIzrsEsucyOIZQYMkXUiTkmZq5am/NyXKkg==} + registry.npmjs.org/@vue/compiler-ssr/3.2.37: + resolution: {integrity: sha512-7mQJD7HdXxQjktmsWp/J67lThEIcxLemz1Vb5I6rYJHR5vI+lON3nPGOH3ubmbvYGt8xEUaAr1j7/tIFWiEOqw==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.2.37.tgz} + name: '@vue/compiler-ssr' + version: 3.2.37 dependencies: - '@babel/parser': 7.18.6 - '@vue/compiler-core': 3.2.37 - '@vue/compiler-dom': 3.2.37 - '@vue/compiler-ssr': 3.2.37 - '@vue/reactivity-transform': 3.2.37 - '@vue/shared': 3.2.37 - estree-walker: 2.0.2 - magic-string: 0.25.9 - postcss: 8.4.14 - source-map: 0.6.1 + '@vue/compiler-dom': registry.npmjs.org/@vue/compiler-dom/3.2.37 + '@vue/shared': registry.npmjs.org/@vue/shared/3.2.37 dev: false - /@vue/compiler-ssr/3.2.37: - resolution: {integrity: sha512-7mQJD7HdXxQjktmsWp/J67lThEIcxLemz1Vb5I6rYJHR5vI+lON3nPGOH3ubmbvYGt8xEUaAr1j7/tIFWiEOqw==} + registry.npmjs.org/@vue/reactivity-transform/3.2.37: + resolution: {integrity: sha512-IWopkKEb+8qpu/1eMKVeXrK0NLw9HicGviJzhJDEyfxTR9e1WtpnnbYkJWurX6WwoFP0sz10xQg8yL8lgskAZg==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.2.37.tgz} + name: '@vue/reactivity-transform' + version: 3.2.37 dependencies: - '@vue/compiler-dom': 3.2.37 - '@vue/shared': 3.2.37 + '@babel/parser': registry.npmjs.org/@babel/parser/7.18.6 + '@vue/compiler-core': registry.npmjs.org/@vue/compiler-core/3.2.37 + '@vue/shared': registry.npmjs.org/@vue/shared/3.2.37 + estree-walker: registry.npmjs.org/estree-walker/2.0.2 + magic-string: registry.npmjs.org/magic-string/0.25.9 dev: false - /@vue/reactivity-transform/3.2.37: - resolution: {integrity: sha512-IWopkKEb+8qpu/1eMKVeXrK0NLw9HicGviJzhJDEyfxTR9e1WtpnnbYkJWurX6WwoFP0sz10xQg8yL8lgskAZg==} + registry.npmjs.org/@vue/reactivity/3.2.37: + resolution: {integrity: sha512-/7WRafBOshOc6m3F7plwzPeCu/RCVv9uMpOwa/5PiY1Zz+WLVRWiy0MYKwmg19KBdGtFWsmZ4cD+LOdVPcs52A==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.2.37.tgz} + name: '@vue/reactivity' + version: 3.2.37 dependencies: - '@babel/parser': 7.18.6 - '@vue/compiler-core': 3.2.37 - '@vue/shared': 3.2.37 - estree-walker: 2.0.2 - magic-string: 0.25.9 + '@vue/shared': registry.npmjs.org/@vue/shared/3.2.37 dev: false - /@vue/reactivity/3.2.37: - resolution: {integrity: sha512-/7WRafBOshOc6m3F7plwzPeCu/RCVv9uMpOwa/5PiY1Zz+WLVRWiy0MYKwmg19KBdGtFWsmZ4cD+LOdVPcs52A==} + registry.npmjs.org/@vue/runtime-core/3.2.37: + resolution: {integrity: sha512-JPcd9kFyEdXLl/i0ClS7lwgcs0QpUAWj+SKX2ZC3ANKi1U4DOtiEr6cRqFXsPwY5u1L9fAjkinIdB8Rz3FoYNQ==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.2.37.tgz} + name: '@vue/runtime-core' + version: 3.2.37 dependencies: - '@vue/shared': 3.2.37 + '@vue/reactivity': registry.npmjs.org/@vue/reactivity/3.2.37 + '@vue/shared': registry.npmjs.org/@vue/shared/3.2.37 dev: false - /@vue/runtime-core/3.2.37: - resolution: {integrity: sha512-JPcd9kFyEdXLl/i0ClS7lwgcs0QpUAWj+SKX2ZC3ANKi1U4DOtiEr6cRqFXsPwY5u1L9fAjkinIdB8Rz3FoYNQ==} + registry.npmjs.org/@vue/runtime-dom/3.2.37: + resolution: {integrity: sha512-HimKdh9BepShW6YozwRKAYjYQWg9mQn63RGEiSswMbW+ssIht1MILYlVGkAGGQbkhSh31PCdoUcfiu4apXJoPw==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.2.37.tgz} + name: '@vue/runtime-dom' + version: 3.2.37 dependencies: - '@vue/reactivity': 3.2.37 - '@vue/shared': 3.2.37 + '@vue/runtime-core': registry.npmjs.org/@vue/runtime-core/3.2.37 + '@vue/shared': registry.npmjs.org/@vue/shared/3.2.37 + csstype: registry.npmjs.org/csstype/2.6.20 dev: false - /@vue/runtime-dom/3.2.37: - resolution: {integrity: sha512-HimKdh9BepShW6YozwRKAYjYQWg9mQn63RGEiSswMbW+ssIht1MILYlVGkAGGQbkhSh31PCdoUcfiu4apXJoPw==} - dependencies: - '@vue/runtime-core': 3.2.37 - '@vue/shared': 3.2.37 - csstype: 2.6.20 - dev: false - - /@vue/server-renderer/3.2.37: - resolution: {integrity: sha512-kLITEJvaYgZQ2h47hIzPh2K3jG8c1zCVbp/o/bzQOyvzaKiCquKS7AaioPI28GNxIsE/zSx+EwWYsNxDCX95MA==} + registry.npmjs.org/@vue/server-renderer/3.2.37: + resolution: {integrity: sha512-kLITEJvaYgZQ2h47hIzPh2K3jG8c1zCVbp/o/bzQOyvzaKiCquKS7AaioPI28GNxIsE/zSx+EwWYsNxDCX95MA==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.2.37.tgz} + name: '@vue/server-renderer' + version: 3.2.37 peerDependencies: vue: 3.2.37 dependencies: - '@vue/compiler-ssr': 3.2.37 - '@vue/shared': 3.2.37 + '@vue/compiler-ssr': registry.npmjs.org/@vue/compiler-ssr/3.2.37 + '@vue/shared': registry.npmjs.org/@vue/shared/3.2.37 dev: false - /@vue/shared/3.2.37: - resolution: {integrity: sha512-4rSJemR2NQIo9Klm1vabqWjD8rs/ZaJSzMxkMNeJS6lHiUjjUeYFbooN19NgFjztubEKh3WlZUeOLVdbbUWHsw==} + registry.npmjs.org/@vue/shared/3.2.37: + resolution: {integrity: sha512-4rSJemR2NQIo9Klm1vabqWjD8rs/ZaJSzMxkMNeJS6lHiUjjUeYFbooN19NgFjztubEKh3WlZUeOLVdbbUWHsw==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/@vue/shared/-/shared-3.2.37.tgz} + name: '@vue/shared' + version: 3.2.37 dev: false - /acorn-walk/8.2.0: - resolution: {integrity: sha512-k+iyHEuPgSw6SbuDpGQM+06HQUa04DZ3o+F6CSzXMvvI5KMvnaEqXe+YVe555R9nn6GPt404fos4wcgpw12SDA==} - engines: {node: '>=0.4.0'} - dev: true - - /acorn/8.7.0: - resolution: {integrity: sha512-V/LGr1APy+PXIwKebEWrkZPwoeoF+w1jiOBUmuxuiUIaOHtob8Qc9BTrYo7VuI5fR8tqsy+buA2WFooR5olqvQ==} - engines: {node: '>=0.4.0'} - hasBin: true - dev: true - - /arg/4.1.3: - resolution: {integrity: sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==} - dev: true - - /create-require/1.1.1: - resolution: {integrity: sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==} - dev: true - - /csstype/2.6.20: - resolution: {integrity: sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==} + registry.npmjs.org/csstype/2.6.20: + resolution: {integrity: sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/csstype/-/csstype-2.6.20.tgz} + name: csstype + version: 2.6.20 dev: false - /diff/4.0.2: - resolution: {integrity: sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==} - engines: {node: '>=0.3.1'} - dev: true - - /estree-walker/2.0.2: - resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==} + registry.npmjs.org/estree-walker/2.0.2: + resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/estree-walker/-/estree-walker-2.0.2.tgz} + name: estree-walker + version: 2.0.2 dev: false - /magic-string/0.25.9: - resolution: {integrity: sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==} + registry.npmjs.org/magic-string/0.25.9: + resolution: {integrity: sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/magic-string/-/magic-string-0.25.9.tgz} + name: magic-string + version: 0.25.9 dependencies: - sourcemap-codec: 1.4.8 + sourcemap-codec: registry.npmjs.org/sourcemap-codec/1.4.8 dev: false - /make-error/1.3.6: - resolution: {integrity: sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==} - dev: true - - /nanoid/3.3.4: - resolution: {integrity: sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==} + registry.npmjs.org/nanoid/3.3.4: + resolution: {integrity: sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz} + name: nanoid + version: 3.3.4 engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} hasBin: true dev: false - /picocolors/1.0.0: - resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==} + registry.npmjs.org/picocolors/1.0.0: + resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz} + name: picocolors + version: 1.0.0 dev: false - /postcss/8.4.14: - resolution: {integrity: sha512-E398TUmfAYFPBSdzgeieK2Y1+1cpdxJx8yXbK/m57nRhKSmk1GB2tO4lbLBtlkfPQTDKfe4Xqv1ASWPpayPEig==} + registry.npmjs.org/postcss/8.4.14: + resolution: {integrity: sha512-E398TUmfAYFPBSdzgeieK2Y1+1cpdxJx8yXbK/m57nRhKSmk1GB2tO4lbLBtlkfPQTDKfe4Xqv1ASWPpayPEig==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/postcss/-/postcss-8.4.14.tgz} + name: postcss + version: 8.4.14 engines: {node: ^10 || ^12 || >=14} dependencies: - nanoid: 3.3.4 - picocolors: 1.0.0 - source-map-js: 1.0.2 + nanoid: registry.npmjs.org/nanoid/3.3.4 + picocolors: registry.npmjs.org/picocolors/1.0.0 + source-map-js: registry.npmjs.org/source-map-js/1.0.2 dev: false - /source-map-js/1.0.2: - resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==} + registry.npmjs.org/source-map-js/1.0.2: + resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz} + name: source-map-js + version: 1.0.2 engines: {node: '>=0.10.0'} dev: false - /source-map/0.6.1: - resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==} + registry.npmjs.org/source-map/0.6.1: + resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz} + name: source-map + version: 0.6.1 engines: {node: '>=0.10.0'} dev: false - /sourcemap-codec/1.4.8: - resolution: {integrity: sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==} + registry.npmjs.org/sourcemap-codec/1.4.8: + resolution: {integrity: sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz} + name: sourcemap-codec + version: 1.4.8 dev: false - /to-fast-properties/2.0.0: - resolution: {integrity: sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==} + registry.npmjs.org/to-fast-properties/2.0.0: + resolution: {integrity: sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz} + name: to-fast-properties + version: 2.0.0 engines: {node: '>=4'} dev: false - /ts-node/10.5.0_tgseqbmpq5foykrvhuhjoqlhzq: - resolution: {integrity: sha512-6kEJKwVxAJ35W4akuiysfKwKmjkbYxwQMTBaAxo9KKAx/Yd26mPUyhGz3ji+EsJoAgrLqVsYHNuuYwQe22lbtw==} - hasBin: true - peerDependencies: - '@swc/core': '>=1.2.50' - '@swc/wasm': '>=1.2.50' - '@types/node': '*' - typescript: '>=2.7' - peerDependenciesMeta: - '@swc/core': - optional: true - '@swc/wasm': - optional: true + registry.npmjs.org/vue/3.2.37: + resolution: {integrity: sha512-bOKEZxrm8Eh+fveCqS1/NkG/n6aMidsI6hahas7pa0w/l7jkbssJVsRhVDs07IdDq7h9KHswZOgItnwJAgtVtQ==, registry: https://registry.npmjs.com/, tarball: https://registry.npmjs.org/vue/-/vue-3.2.37.tgz} + name: vue + version: 3.2.37 dependencies: - '@cspotcode/source-map-support': 0.7.0 - '@tsconfig/node10': 1.0.8 - '@tsconfig/node12': 1.0.9 - '@tsconfig/node14': 1.0.1 - '@tsconfig/node16': 1.0.2 - '@types/node': 17.0.21 - acorn: 8.7.0 - acorn-walk: 8.2.0 - arg: 4.1.3 - create-require: 1.1.1 - diff: 4.0.2 - make-error: 1.3.6 - typescript: 4.5.5 - v8-compile-cache-lib: 3.0.0 - yn: 3.1.1 - dev: true - - /typescript/4.5.5: - resolution: {integrity: sha512-TCTIul70LyWe6IJWT8QSYeA54WQe8EjQFU4wY52Fasj5UKx88LNYKCgBEHcOMOrFF1rKGbD8v/xcNWVUq9SymA==} - engines: {node: '>=4.2.0'} - hasBin: true - dev: true - - /v8-compile-cache-lib/3.0.0: - resolution: {integrity: sha512-mpSYqfsFvASnSn5qMiwrr4VKfumbPyONLCOPmsR3A6pTY/r0+tSaVbgPWSAIuzbk3lCTa+FForeTiO+wBQGkjA==} - dev: true - - /vue/3.2.37: - resolution: {integrity: sha512-bOKEZxrm8Eh+fveCqS1/NkG/n6aMidsI6hahas7pa0w/l7jkbssJVsRhVDs07IdDq7h9KHswZOgItnwJAgtVtQ==} - dependencies: - '@vue/compiler-dom': 3.2.37 - '@vue/compiler-sfc': 3.2.37 - '@vue/runtime-dom': 3.2.37 - '@vue/server-renderer': 3.2.37 - '@vue/shared': 3.2.37 - transitivePeerDependencies: - - vue + '@vue/compiler-dom': registry.npmjs.org/@vue/compiler-dom/3.2.37 + '@vue/compiler-sfc': registry.npmjs.org/@vue/compiler-sfc/3.2.37 + '@vue/runtime-dom': registry.npmjs.org/@vue/runtime-dom/3.2.37 + '@vue/server-renderer': registry.npmjs.org/@vue/server-renderer/3.2.37 + '@vue/shared': registry.npmjs.org/@vue/shared/3.2.37 dev: false - - /yn/3.1.1: - resolution: {integrity: sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==} - engines: {node: '>=6'} - dev: true From 89c2e068632cabe82bca038e7ecd27d89cf7adb4 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 11:10:52 +0800 Subject: [PATCH 09/59] chore: update deps --- package.json | 1 - pnpm-lock.yaml | 6 ------ 2 files changed, 7 deletions(-) diff --git a/package.json b/package.json index 5ade531..f706ade 100644 --- a/package.json +++ b/package.json @@ -20,7 +20,6 @@ }, "license": "MIT", "dependencies": { - "@dcloudio/uni-helper-json": "^1.0.13", "vue3": "npm:vue@3" }, "devDependencies": { diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 6630ade..fc85ba0 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1,13 +1,11 @@ lockfileVersion: 5.4 specifiers: - '@dcloudio/uni-helper-json': ^1.0.13 '@types/node': ^17.0.21 typescript: ^4.5.5 vue3: npm:vue@3 dependencies: - '@dcloudio/uni-helper-json': 1.0.13 vue3: registry.npmjs.org/vue/3.2.37 devDependencies: @@ -16,10 +14,6 @@ devDependencies: packages: - /@dcloudio/uni-helper-json/1.0.13: - resolution: {integrity: sha512-FO9Iu4zW4td3Tr+eiCDWuele2ehkJ4qxQ/UhpAMLjso+ZdWz6NagK5Syh6cdy1hoDqbxpNoqnLynuJXe81Ereg==} - dev: false - /@types/node/17.0.21: resolution: {integrity: sha512-DBZCJbhII3r90XbQxI8Y9IjjiiOGlZ0Hr32omXIZvwwZ7p4DMMXGrKXVyPfuoBOri9XNtL0UK69jYIBIsRX3QQ==} dev: true From 7caa39a0b6e5d58c3a82d077048462c9ec60bef5 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 11:40:57 +0800 Subject: [PATCH 10/59] feat: events --- index.d.ts | 126 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 126 insertions(+) diff --git a/index.d.ts b/index.d.ts index 3775739..1ea6ba5 100644 --- a/index.d.ts +++ b/index.d.ts @@ -11,6 +11,132 @@ import type { } from "vue3"; type PublicProps = VNodeProps & AllowedComponentProps & ComponentCustomProps; +/** + * @desc 基础事件对象属性列表 + */ +type TBaseEvent = { + /** + * @desc 事件类型 + */ + type: string; + /** + * @desc 事件生成时的时间戳 + */ + timeStamp: number; + /** + * @desc 触发事件的组件的一些属性值集合 + */ + target: { + /** + * @desc 事件源组件的id + */ + id: string; + /** + * @desc 事件源组件上由 data- 开头的自定义属性组成的集合 + */ + dataset: Record; + }; + /** + * @desc 当前组件的一些属性值集合 + */ + currentTarget?: { + /** + * @desc 当前组件的id + */ + id: string; + /** + * @desc 当前组件上由data-开头的自定义属性组成的集合 + */ + dataset: Record; + }; + /** + * @desc 事件标记数据 + */ + mark?: Record; +}; + +/** + * @desc 自定义事件对象属性列表 + */ +type TCustomerEvent = TBaseEvent & { + /** + * @desc 额外的信息 + */ + detail: Record; +}; + +/** + * @desc 触摸事件对象属性列表 + */ +type TTouchEvent = TBaseEvent & { + /** + * @desc 触摸事件，当前停留在屏幕中的触摸点信息的数组 + */ + touches: { + /** + * @desc 触摸点的标识符 + */ + identifier: number; + /** + * @desc 距离文档左上角的距离，文档的左上角为原点，横向为 X 轴，纵向为 Y 轴 + */ + pageX: number; + /** + * @desc 距离文档左上角的距离，文档的左上角为原点，横向为 X 轴，纵向为 Y 轴 + */ + pageY: number; + /** + * @desc 距离页面可显示区域（屏幕除去导航条）左上角距离，横向为 X 轴，纵向为 Y 轴 + */ + clientX: number; + /** + * @desc 距离页面可显示区域（屏幕除去导航条）左上角距离，横向为 X 轴，纵向为 Y 轴 + */ + clientY: number; + /** + * @desc 距离 Canvas 左上角的距离，Canvas 的左上角为原点 ，横向为 X 轴，纵向为 Y 轴 + */ + x: number; + /** + * @desc 距离 Canvas 左上角的距离，Canvas 的左上角为原点，横向为 X 轴，纵向为 Y 轴 + */ + y: number; + }[]; + /** + * @desc 触摸事件，当前变化的触摸点信息的数组 + */ + changedTouches: { + /** + * @desc 触摸点的标识符 + */ + identifier: number; + /** + * @desc 距离文档左上角的距离，文档的左上角为原点，横向为 X 轴，纵向为 Y 轴 + */ + pageX: number; + /** + * @desc 距离文档左上角的距离，文档的左上角为原点，横向为 X 轴，纵向为 Y 轴 + */ + pageY: number; + /** + * @desc 距离页面可显示区域（屏幕除去导航条）左上角距离，横向为 X 轴，纵向为 Y 轴 + */ + clientX: number; + /** + * @desc 距离页面可显示区域（屏幕除去导航条）左上角距离，横向为 X 轴，纵向为 Y 轴 + */ + clientY: number; + /** + * @desc 距离 Canvas 左上角的距离，Canvas 的左上角为原点 ，横向为 X 轴，纵向为 Y 轴 + */ + x: number; + /** + * @desc 距离 Canvas 左上角的距离，Canvas 的左上角为原点，横向为 X 轴，纵向为 Y 轴 + */ + y: number; + }[]; +}; + type TComponent< P extends Record, E extends EmitsOptions From b2174bf57adf0f0e02463dee85a209583fd4bf39 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 11:46:14 +0800 Subject: [PATCH 11/59] feat: scroll-view --- index.d.ts | 170 ++++++++++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 155 insertions(+), 15 deletions(-) diff --git a/index.d.ts b/index.d.ts index 1ea6ba5..fd07b4d 100644 --- a/index.d.ts +++ b/index.d.ts @@ -195,29 +195,169 @@ type TView = TComponent< {} >; -/** 可滚动视图区域 */ +/** + * @desc 可滚动视图区域，用于区域滚动 + * @desc 在 webview 渲染的页面中，区域滚动的性能不及页面滚动 + */ type TScrollView = TComponent< { - /** 允许横向滚动 */ + /** + * @desc 是否允许横向滚动 + * @desc 默认为 false + */ scrollX: boolean; - /** 允许纵向滚动 */ + /** + * @desc 是否允许纵向滚动 + * @desc 默认为 false + */ scrollY: boolean; - /** 距顶部/左边多远时（单位px），触发 scrolltoupper 事件 */ - upperThreshold: number; - /** 距底部/右边多远时（单位px），触发 scrolltolower 事件 */ - lowerThreshold: number; - /** 滚动位置，可以使用 px 或者 rpx 为单位，在被设置时，页面会滚动到对应位置 */ - scrollTop: string; - /** 设置横向滚动条位置 */ - scrollLeft: number; - /** 值应为某子元素id（id不能以数字开头）。设置哪个方向可滚动，则在哪个方向滚动到该元素 */ + /** + * @desc 距顶部/左边多远时触发 scrolltoupper 事件 + * @desc 单位为 px + * @desc 默认为 50 + */ + upperThreshold: number | string; + /** + * @desc 距底部/右边多远时触发 scrolltolower 事件 + * @desc 单位为 px + * @desc 默认为 50 + */ + lowerThreshold: number | string; + /** + * @desc 设置纵向滚动条位置 + */ + scrollTop: number | string; + /** + * @decs 设置横向滚动条位置 + */ + scrollLeft: number | string; + /** + * @desc 值应为某子元素 id，id 不能以数字开头 + * @desc 设置哪个方向可滚动，则在哪个方向滚动到该元素 + */ scrollIntoView: string; - /** 在设置滚动条位置时使用动画过渡 */ + /** + * @desc 在设置滚动条位置时是否使用动画过渡 + * @desc 默认为 false + */ scrollWithAnimation: boolean; - /** iOS点击顶部状态栏、安卓双击标题栏时，滚动条返回顶部，只支持竖向 */ + /** + * @desc 是否允许 iOS 点击顶部状态栏、安卓双击标题栏时，滚动条返回顶部 + * @desc 只支持纵向 + * @desc 默认为 false + */ enableBackToTop: boolean; + /** + * @desc 是否启用 flexbox 布局 + * @desc 开启后，当前节点声明了 display: flex 就会成为 flex container，并作用于其子节点 + * @desc 默认为 false + */ + enableFlex: boolean; + /** + * @desc 是否开启 scroll anchoring 特性，即控制滚动位置不随内容变化而抖动，仅在 iOS 下生效 + * @desc 安卓下可参考 CSS overflow-anchor 属性 + * @desc 默认为 false + */ + scrollAnchoring: boolean; + /** + * @desc 是否开启自定义下拉刷新 + * @desc 默认为 false + */ + refresherEnabled: boolean; + /** + * @desc 设置自定义下拉刷新阈值 + * @desc 默认为 45 + */ + refresherThreshold: number; + /** + * @desc 设置自定义下拉刷新默认样式 + * @desc none 表示不使用默认样式 + * @desc 默认为 black + */ + refresherDefaultStyle: "black" | "white" | "none"; + /** + * @desc 自定义下拉刷新区域背景颜色 + * @desc 默认为 #FFF + */ + refresherBackground: string; + /** + * @desc 设置当前下拉刷新状态 + * @desc true 表示下拉刷新已经被触发，false 表示下拉刷新未被触发 + * @desc 默认为 false + */ + refresherTriggered: boolean; + /** + * @desc 启用 scroll-view 增强特性 + * @desc 启用后可通过 ScrollViewContext 操作 scroll-view + * @desc 默认为 false + */ + enhanced: boolean; + /** + * @desc iOS 下 scroll-view 边界弹性控制 + * @desc 同时开启 enhanced 属性后生效 + * @desc 默认为 true + */ + bounces: boolean; + /** + * @desc 滚动条显隐控制 + * @desc 同时开启 enhanced 属性后生效 + * @desc 默认为 true + */ + showScrollbar: boolean; + /** + * @desc 分页滑动效果 + * @desc 同时开启 enhanced 属性后生效 + * @desc 默认为 false + */ + pagingEnabled: boolean; + /** + * @desc 滑动减速速率控制 + * @desc 同时开启 enhanced 属性后生效 + * @desc 默认为 false + */ + fastDeceleration: boolean; }, - {} + { + /** + * @desc 滚动到顶部/左边时触发 + */ + scrolltoupper: (event: TBaseEvent) => void; + /** + * @desc 滚动到底部/右边时触发 + */ + scrolltolower: (event: TBaseEvent) => void; + /** + * @desc 滚动时触发 + */ + scroll: ( + event: TCustomerEvent & { + detail: { + scrollLeft: number; + scrollTop: number; + scrollHeight: umber; + scrollWidth: number; + deltaX: number; + deltaY: number; + }; + } + ) => void; + /** + * @desc 自定义下拉刷新控件被下拉时触发 + */ + refresherpulling: (event: TBaseEvent) => void; + /** + * @desc 自定义下拉刷新被触发时触发 + */ + refresherrefresh: (event: TBaseEvent) => void; + /** + * @desc 自定义下拉刷新被复位时触发 + */ + refresherrestore: (event: TBaseEvent) => void; + /** + * @desc 自定义下拉刷新被中止时触发 + */ + refresherabort: (event: TBaseEvent) => void; + } >; /** media query 匹配检测节点 */ From 2e7626ad28d0a3474f66a745d3ff32736b32893a Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 11:58:48 +0800 Subject: [PATCH 12/59] fix: fix type --- index.d.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.d.ts b/index.d.ts index fd07b4d..6695152 100644 --- a/index.d.ts +++ b/index.d.ts @@ -334,7 +334,7 @@ type TScrollView = TComponent< detail: { scrollLeft: number; scrollTop: number; - scrollHeight: umber; + scrollHeight: number; scrollWidth: number; deltaX: number; deltaY: number; From 6f2c8d2b0132fe7f5fa943a564a43f543767c0cd Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 12:43:06 +0800 Subject: [PATCH 13/59] docs: update README --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index 93f969b..ab5cd9d 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,7 @@ # uni-base-components-types +基于 [Volar](https://github.com/johnsoncodehk/volar) 的 `uni-app` 基础组件代码提示 + 1. 安装依赖 ```bash From 16e5ffbf612ef429ca677db38b2c864f7a261a32 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 12:58:58 +0800 Subject: [PATCH 14/59] fix: fix types --- index.d.ts | 82 ++++++++++++++++++++++++++---------------------------- 1 file changed, 40 insertions(+), 42 deletions(-) diff --git a/index.d.ts b/index.d.ts index 6695152..c061ac3 100644 --- a/index.d.ts +++ b/index.d.ts @@ -9,8 +9,26 @@ import type { ExtractPropTypes, EmitsOptions, } from "vue3"; + type PublicProps = VNodeProps & AllowedComponentProps & ComponentCustomProps; +type TComponent< + P extends Record, + E extends EmitsOptions +> = DefineComponent< + {}, + {}, + {}, + ComputedOptions, + MethodOptions, + ComponentOptionsMixin, + ComponentOptionsMixin, + E, + string, + PublicProps, + Readonly> +>; +/* ---- 事件对象 ---- */ /** * @desc 基础事件对象属性列表 */ @@ -54,17 +72,15 @@ type TBaseEvent = { */ mark?: Record; }; - /** * @desc 自定义事件对象属性列表 */ -type TCustomerEvent = TBaseEvent & { +type TCustomEvent = TBaseEvent & { /** * @desc 额外的信息 */ detail: Record; }; - /** * @desc 触摸事件对象属性列表 */ @@ -136,24 +152,18 @@ type TTouchEvent = TBaseEvent & { y: number; }[]; }; +type TScrollViewCustomEvent = TBaseEvent & { + detail: { + scrollLeft: number; + scrollTop: number; + scrollHeight: number; + scrollWidth: number; + deltaX: number; + deltaY: number; + }; +}; -type TComponent< - P extends Record, - E extends EmitsOptions -> = DefineComponent< - {}, - {}, - {}, - ComputedOptions, - MethodOptions, - ComponentOptionsMixin, - ComponentOptionsMixin, - E, - string, - PublicProps, - Readonly> ->; - +/* ---- 元素 ---- */ /** * @desc 包装元素，不会在页面中做任何渲染，只接受控制属性 * @desc 支持在 template 模板中嵌套 template 和 block @@ -316,48 +326,36 @@ type TScrollView = TComponent< * @desc 默认为 false */ fastDeceleration: boolean; - }, - { /** * @desc 滚动到顶部/左边时触发 */ - scrolltoupper: (event: TBaseEvent) => void; + onScrolltoupper: (event: TBaseEvent) => void; /** * @desc 滚动到底部/右边时触发 */ - scrolltolower: (event: TBaseEvent) => void; + onScrolltolower: (event: TBaseEvent) => void; /** * @desc 滚动时触发 */ - scroll: ( - event: TCustomerEvent & { - detail: { - scrollLeft: number; - scrollTop: number; - scrollHeight: number; - scrollWidth: number; - deltaX: number; - deltaY: number; - }; - } - ) => void; + onScroll: (event: TScrollViewCustomEvent) => void; /** * @desc 自定义下拉刷新控件被下拉时触发 */ - refresherpulling: (event: TBaseEvent) => void; + onRefresherpulling: (event: TBaseEvent) => void; /** * @desc 自定义下拉刷新被触发时触发 */ - refresherrefresh: (event: TBaseEvent) => void; + onRefresherrefresh: (event: TBaseEvent) => void; /** * @desc 自定义下拉刷新被复位时触发 */ - refresherrestore: (event: TBaseEvent) => void; + onRefresherrestore: (event: TBaseEvent) => void; /** * @desc 自定义下拉刷新被中止时触发 */ - refresherabort: (event: TBaseEvent) => void; - } + onRefresherabort: (event: TBaseEvent) => void; + }, + {} >; /** media query 匹配检测节点 */ @@ -1305,7 +1303,7 @@ type TUnicloudDb = TComponent< {} >; -declare module "vue" { +declare module "@vue/runtime-core" { export interface GlobalComponents { Block: TBlock; View: TView; From 67dc0128e110779765162e95cf7efce494a236c7 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 13:44:40 +0800 Subject: [PATCH 15/59] fix: fix scroll-view types --- index.d.ts | 39 +++++++++++++++++++++++---------------- 1 file changed, 23 insertions(+), 16 deletions(-) diff --git a/index.d.ts b/index.d.ts index c061ac3..d16176f 100644 --- a/index.d.ts +++ b/index.d.ts @@ -28,9 +28,10 @@ type TComponent< Readonly> >; -/* ---- 事件对象 ---- */ +/* ---- 通用事件对象 ---- */ + /** - * @desc 基础事件对象属性列表 + * @desc 基础事件对象 */ type TBaseEvent = { /** @@ -72,8 +73,9 @@ type TBaseEvent = { */ mark?: Record; }; + /** - * @desc 自定义事件对象属性列表 + * @desc 自定义事件对象 */ type TCustomEvent = TBaseEvent & { /** @@ -81,8 +83,9 @@ type TCustomEvent = TBaseEvent & { */ detail: Record; }; + /** - * @desc 触摸事件对象属性列表 + * @desc 触摸事件对象 */ type TTouchEvent = TBaseEvent & { /** @@ -152,18 +155,9 @@ type TTouchEvent = TBaseEvent & { y: number; }[]; }; -type TScrollViewCustomEvent = TBaseEvent & { - detail: { - scrollLeft: number; - scrollTop: number; - scrollHeight: number; - scrollWidth: number; - deltaX: number; - deltaY: number; - }; -}; -/* ---- 元素 ---- */ +/* ---- 元素和对应事件对象 ---- */ + /** * @desc 包装元素，不会在页面中做任何渲染，只接受控制属性 * @desc 支持在 template 模板中嵌套 template 和 block @@ -205,6 +199,19 @@ type TView = TComponent< {} >; +/** + * @desc scroll-view scroll 事件对象 + */ +type TScrollViewScrollEvent = TBaseEvent & { + detail: { + scrollLeft: number; + scrollTop: number; + scrollHeight: number; + scrollWidth: number; + deltaX: number; + deltaY: number; + }; +}; /** * @desc 可滚动视图区域，用于区域滚动 * @desc 在 webview 渲染的页面中，区域滚动的性能不及页面滚动 @@ -337,7 +344,7 @@ type TScrollView = TComponent< /** * @desc 滚动时触发 */ - onScroll: (event: TScrollViewCustomEvent) => void; + onScroll: (event: TScrollViewScrollEvent) => void; /** * @desc 自定义下拉刷新控件被下拉时触发 */ From f88b6f3da61939f8a6679427ae602c9dc47e93ad Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 13:45:04 +0800 Subject: [PATCH 16/59] feat: update swiper types --- index.d.ts | 186 +++++++++++++++++++++++++++++++++++++++-------------- 1 file changed, 138 insertions(+), 48 deletions(-) diff --git a/index.d.ts b/index.d.ts index d16176f..16896df 100644 --- a/index.d.ts +++ b/index.d.ts @@ -365,72 +365,162 @@ type TScrollView = TComponent< {} >; -/** media query 匹配检测节点 */ -type TMatchMedia = TComponent< - { - /** 页面宽度（px 为单位） */ - width: number; - /** 页面最小宽度（px 为单位） */ - minWidth: number; - /** 页面最大宽度（px 为单位） */ - maxWidth: number; - /** 页面高度（px 为单位） */ - height: number; - /** 页面最小高度（px 为单位） */ - minHeight: number; - /** 页面最大高度（px 为单位） */ - maxHeight: number; - /** 画面方向，可选值有 vertical，horizontal */ - orientation: "vertical" | "horizontal"; - }, - {} ->; - -/** 滑块视图容器 */ +/** + * @desc swiper change 事件对象 + */ +type TSwiperChangeEvent = TBaseEvent & { + detail: { + current: number; + source: any; // TODO: better types + }; +}; +/** + * @desc swiper transition 事件对象 + */ +type TSwiperTransitionEvent = TBaseEvent & { + detail: { + dx: number; + dy: number; + }; +}; +/** + * @desc swiper animationfinish 事件对象 + */ +type TSwiperAnimationfinishEvent = TBaseEvent & { + detail: { + current: number; + source: any; // TODO: better types + }; +}; +/** + * @desc 滑块视图容器 + * @desc 一般用于左右滑动或上下滑动，比如 banner 轮播图 + */ type TSwiper = TComponent< { - /** 是否显示面板指示点 */ + /** + * @desc 是否显示面板指示点 + * @desc 默认为 false + */ indicatorDots: boolean; - /** 指示点颜色 */ + /** + * @desc 指示点颜色 + * @desc 默认为 rgba(0, 0, 0, 0.3) + */ indicatorColor: string; - /** 当前选中的指示点颜色 */ + /** + * @desc 当前选中的指示点颜色 + * @desc 默认为 #000 + */ indicatorActiveColor: string; - /** swiper-item 可见时的 class */ + /** + * @desc swiper-item 可见时的 class + */ activeClass: string; - /** acceleration 设置为 {{true}} 时且处于滑动过程中，中间若干屏处于可见时的class */ + /** + * @desc acceleration 设置为 true 时且处于滑动过程中，中间若干屏处于可见时的 class + */ changingClass: boolean; - /** 当开启时，会根据滑动速度，连续滑动多屏 */ - acceleration: boolean; - /** 是否禁用代码变动触发 swiper 切换时使用动画。 */ - disableProgrammaticAnimation: boolean; - /** 是否禁止用户 touch 操作 */ - disableTouch: boolean; - /** 是否监听用户的触摸事件 */ - touchable: boolean; - /** 指定 swiper 切换缓动动画类型，有效值：default、linear、easeInCubic、easeOutCubic、easeInOutCubic */ - easingFunction: string; - /** 自动播放 */ + /** + * @desc 是否自动切换 + * @desc 默认为 false + */ autoplay: boolean; - /** 当前所在滑块的 index */ + /** + * @desc 当前所在滑块的下标 + * @desc 默认为 0 + */ current: number; - /** 当前所在滑块的 item-id ，不能与 current 被同时指定 */ + /** + * @desc 当前所在滑块的 item-id ，不能与 current 被同时指定 + */ currentItemId: string; - /** 自动切换时间间隔 */ + /** + * @desc 自动切换时间间隔 + * @desc 默认为 5000 + */ interval: number; - /** 指定视频长度 */ + /** + * @desc 滑动动画时长 + * @desc 默认为 500 + */ duration: number; - /** 是否采用衔接滑动 */ + /** + * @desc 是否采用衔接滑动，即播放到末尾后重新回到开头 + * @desc 默认为 false + */ circular: boolean; - /** 滑动方向是否为纵向 */ + /** + * @desc 滑动方向是否为纵向 + * @desc 默认为 false + */ vertical: boolean; - /** 前边距，可用于露出前一项的一小部分，接受 px 和 rpx 值 */ + /** + * @desc 前边距，可用于露出前一项的一小部分 + * @desc 接受 px 和 rpx 值 + * @desc 默认为 0px + */ previousMargin: string; - /** 后边距，可用于露出后一项的一小部分，接受 px 和 rpx 值 */ + /** + * @desc 后边距，可用于露出后一项的一小部分 + * @desc 接受 px 和 rpx 值 + * @desc 默认为 0px + */ nextMargin: string; - /** 同时显示的滑块数量 */ + /** + * @desc 当开启时，会根据滑动速度，连续滑动多屏 + * @desc 默认 false + */ + acceleration: boolean; + /** + * @desc 是否禁用代码变动触发 swiper 切换时使用动画 + * @desc 默认为 false + */ + disableProgrammaticAnimation: boolean; + /** + * @desc 同时显示的滑块数量 + * @desc 默认为 1 + */ displayMultipleItems: number; - /** 是否跳过未显示的滑块布局，设为 true 可优化复杂情况下的滑动性能，但会丢失隐藏状态滑块的布局信息 */ + /** + * @desc 是否跳过未显示的滑块布局 + * @desc 设为 true 可优化复杂情况下的滑动性能，但会丢失隐藏状态滑块的布局信息 + * @desc 默认为 false + */ skipHiddenItemLayout: boolean; + /** + * @desc 是否禁止用户 touch 操作 + * @desc 默认为 false + */ + disableTouch: boolean; + /** + * @desc 是否监听用户的触摸事件 + * @desc 只在初始化时有效，不能动态变更 + * @desc 默认为 true + */ + touchable: boolean; + /** + * @desc 指定 swiper 切换缓动动画类型 + * @desc 默认为 default + */ + easingFunction: + | "default" + | "linear" + | "easeInCubic" + | "easeOutCubic" + | "easeInOutCubic"; + /** + * @desc current 改变时触发 + */ + onChange: (event: TSwiperChangeEvent) => void; + /** + * @desc swiper-item 位置改变时触发 + */ + onTransition: (event: TSwiperTransitionEvent) => void; + /** + * @desc 动画结束时触发 + */ + onAnimationfinish: (event: TSwiperAnimationfinishEvent) => void; }, {} >; From ee5db985d1f6b8d529e9aabd187a718c32e21c10 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 13:48:13 +0800 Subject: [PATCH 17/59] fix: fix scroll-view types --- index.d.ts | 41 ++++++++--------------------------------- 1 file changed, 8 insertions(+), 33 deletions(-) diff --git a/index.d.ts b/index.d.ts index 16896df..a7a7243 100644 --- a/index.d.ts +++ b/index.d.ts @@ -265,17 +265,10 @@ type TScrollView = TComponent< */ enableBackToTop: boolean; /** - * @desc 是否启用 flexbox 布局 - * @desc 开启后，当前节点声明了 display: flex 就会成为 flex container，并作用于其子节点 + * @desc 控制是否出现滚动条 * @desc 默认为 false */ - enableFlex: boolean; - /** - * @desc 是否开启 scroll anchoring 特性，即控制滚动位置不随内容变化而抖动，仅在 iOS 下生效 - * @desc 安卓下可参考 CSS overflow-anchor 属性 - * @desc 默认为 false - */ - scrollAnchoring: boolean; + showScrollbar: boolean; /** * @desc 是否开启自定义下拉刷新 * @desc 默认为 false @@ -304,35 +297,17 @@ type TScrollView = TComponent< */ refresherTriggered: boolean; /** - * @desc 启用 scroll-view 增强特性 - * @desc 启用后可通过 ScrollViewContext 操作 scroll-view - * @desc 默认为 false - */ - enhanced: boolean; - /** - * @desc iOS 下 scroll-view 边界弹性控制 - * @desc 同时开启 enhanced 属性后生效 - * @desc 默认为 true - */ - bounces: boolean; - /** - * @desc 滚动条显隐控制 - * @desc 同时开启 enhanced 属性后生效 - * @desc 默认为 true - */ - showScrollbar: boolean; - /** - * @desc 分页滑动效果 - * @desc 同时开启 enhanced 属性后生效 + * @desc 是否启用 flexbox 布局 + * @desc 开启后，当前节点声明了 display: flex 就会成为 flex container，并作用于其子节点 * @desc 默认为 false */ - pagingEnabled: boolean; + enableFlex: boolean; /** - * @desc 滑动减速速率控制 - * @desc 同时开启 enhanced 属性后生效 + * @desc 是否开启 scroll anchoring 特性，即控制滚动位置不随内容变化而抖动，仅在 iOS 下生效 + * @desc 安卓下可参考 CSS overflow-anchor 属性 * @desc 默认为 false */ - fastDeceleration: boolean; + scrollAnchoring: boolean; /** * @desc 滚动到顶部/左边时触发 */ From d1baf001b4ea27bd7bbd9bf2cda7a0d808f12122 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 13:49:36 +0800 Subject: [PATCH 18/59] feat: update swiper-item types --- index.d.ts | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/index.d.ts b/index.d.ts index a7a7243..caf4055 100644 --- a/index.d.ts +++ b/index.d.ts @@ -500,10 +500,15 @@ type TSwiper = TComponent< {} >; -/** 仅可放置在 swiper 组件中，宽高自动设置为100% */ +/** + * @desc swiper 直接子组件 + * @desc 仅可放置在 swiper 组件中，宽高自动设置为 100%，不能被子组件自动撑开 + */ type TSwiperItem = TComponent< { - /** 该 swiper-item 的标识符 */ + /** + * @desc 该 swiper-item 的标识符 + */ itemId: string; }, {} From ee30f7c0521029d8a5569d054faa139f993277b1 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 13:54:48 +0800 Subject: [PATCH 19/59] feat: update match-media types --- index.d.ts | 45 +++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 45 insertions(+) diff --git a/index.d.ts b/index.d.ts index caf4055..5f020ed 100644 --- a/index.d.ts +++ b/index.d.ts @@ -514,6 +514,51 @@ type TSwiperItem = TComponent< {} >; +/** + * @desc media query 匹配检测节点 + * @desc 类似于网页开发中使用媒体查询来适配大屏小屏，这是一个可适配不同屏幕的基本视图组件 + * @desc 可以指定一组 media query 媒体查询规则，满足查询条件时，这个组件才会被展示 + */ +type TMatchMedia = TComponent< + { + /** + * @desc 页面最小宽度 + * @desc 单位为 px + */ + minWidth: number; + /** + * @desc 页面最大宽度 + * @desc 单位为 px + */ + maxWidth: number; + /** + * @desc 页面宽度 + * @desc 单位为 px + */ + width: number; + /** + * @desc 页面最小高度 + * @desc 单位为 px + */ + minHeight: number; + /** + * @desc 页面最大高度 + * @desc 单位为 px + */ + maxHeight: number; + /** + * @desc 页面高度 + * @desc 单位为 px + */ + height: number; + /** + * @desc 屏幕方向 + */ + orientation: "landscape" | "portrait"; + }, + {} +>; + /** 可移动的视图容器，在页面中可以拖拽滑动 */ type TMovableView = TComponent< { From 6f87d9ba67bf9925c8d35b299b2f11569ca3d50f Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 14:05:25 +0800 Subject: [PATCH 20/59] feat: update movable-area tpes --- index.d.ts | 20 +++++++++++++++++--- 1 file changed, 17 insertions(+), 3 deletions(-) diff --git a/index.d.ts b/index.d.ts index 5f020ed..8d81efa 100644 --- a/index.d.ts +++ b/index.d.ts @@ -559,6 +559,23 @@ type TMatchMedia = TComponent< {} >; +/** + * @desc 可拖动区域 + * @desc 在其中内嵌 movable-view 组件用于指示可拖动的区域 + * @desc 即手指/鼠标按住 movable-view 拖动或双指缩放，但拖不出 movable-area 规定的范围 + * @desc 必须设置 width 和 height 属性，不设置默认为 10px + */ +type TMovableArea = TComponent< + { + /** + * @desc 当里面的 movable-view 设置为支持双指缩放时，设置此值可将缩放手势生效区域修改为整个 movable-area + * @desc 默认为 false + */ + scaleArea: boolean; + }, + {} +>; + /** 可移动的视图容器，在页面中可以拖拽滑动 */ type TMovableView = TComponent< { @@ -592,9 +609,6 @@ type TMovableView = TComponent< {} >; -/** movable-view 的可移动区域 */ -type TMovableArea = TComponent<{}, {}>; - /** 文本 */ type TText = TComponent< { From d0894cb28c6e0385b11ebeda6d6f272385f248ec Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 15:20:30 +0800 Subject: [PATCH 21/59] feat: update movable-view types --- index.d.ts | 105 +++++++++++++++++++++++++++++++++++++++++++++-------- 1 file changed, 90 insertions(+), 15 deletions(-) diff --git a/index.d.ts b/index.d.ts index 8d81efa..667e634 100644 --- a/index.d.ts +++ b/index.d.ts @@ -563,7 +563,6 @@ type TMatchMedia = TComponent< * @desc 可拖动区域 * @desc 在其中内嵌 movable-view 组件用于指示可拖动的区域 * @desc 即手指/鼠标按住 movable-view 拖动或双指缩放，但拖不出 movable-area 规定的范围 - * @desc 必须设置 width 和 height 属性，不设置默认为 10px */ type TMovableArea = TComponent< { @@ -576,35 +575,111 @@ type TMovableArea = TComponent< {} >; -/** 可移动的视图容器，在页面中可以拖拽滑动 */ +/** + * @desc movable-view change 事件对象 + */ +type TMovableViewChangeEvent = TBaseEvent & { + detail: { + x: number; + y: number; + source: "touch" | "touch-out-of-bounds" | "out-of-bounds" | "friction" | ""; + }; +}; +/** + * @desc movable-view scale 事件对象 + */ +type TMovableViewScaleEvent = TBaseEvent & { + detail: { + x: number; + y: number; + scale: boolean; + }; +}; +/** + * @desc 可移动的视图容器，在页面中可以拖拽滑动或双指缩放 + * @desc movable-area 直接子组件 + */ type TMovableView = TComponent< { - /** movable-view 的移动方向。 */ + /** + * @desc movable-view 的移动方向 + * @desc 默认为 none + */ direction: "all" | "vertical" | "horizontal" | "none"; - /** movable-view 是否带有惯性。 */ + /** + * @desc 是否带有惯性 + * @desc 默认为 false + */ inertia: boolean; - /** 超过可移动区域后，movable-view 是否还可以移动。 */ + /** + * @desc 超过可移动区域后，是否还可以移动 + * @desc 默认为 false + */ outOfBounds: boolean; - /** 定义 x 轴方向的偏移，如果 x 的值不在可移动范围内，会自动移动到可移动范围；改变 x 的值会触发动画。 */ + /** + * @desc 定义 x 轴方向的偏移 + * @desc 如果 x 的值不在可移动范围内，会自动移动到可移动范围 + * @desc 改变 x 的值会触发动画 + */ x: string | number; - /** 定义 y 轴方向的偏移，如果 y 的值不在可移动范围内，会自动移动到可移动范围；改变 y 的值会触发动画。 */ + /** + * @desc 定义 y 轴方向的偏移 + * @desc 如果 y 的值不在可移动范围内，会自动移动到可移动范围 + * @desc 改变 y 的值会触发动画 + */ y: string | number; - /** 阻尼系数，用于控制 x 或 y 改变时的动画和过界回弹的动画，值越大移动越快。 */ + /** + * @desc 阻尼系数，用于控制 x 或 y 改变时的动画和过界回弹的动画 + * @desc 值越大移动越快 + * @desc 默认为 20 + */ damping: number; - /** 摩擦系数，用于控制惯性滑动的动画，值越大摩擦力越大，滑动越快停止；必须大于0，否则会被设置成默认值 2。 */ + /** + * @desc 摩擦系数，用于控制惯性滑动的动画 + * @desc 值越大摩擦力越大，滑动越快停止 + * @desc 必须大于 0，否则会被设置成默认值 + * @desc 默认为 2 + */ friction: number; - /** 是否禁用。 */ + /** + * @desc 是否禁用 + * @desc 默认为 false + */ disabled: boolean; - /** 是否支持双指缩放，默认缩放手势生效区域是在 movable-view 内。 */ + /** + * @desc 是否支持双指缩放 + * @desc 默认缩放手势生效区域是在 movable-view 内 + * @desc 默认为 false + */ scale: boolean; - /** 定义缩放倍数最小值，默认为 0.5。 */ + /** + * @desc 定义缩放倍数最小值 + * @desc 默认为 0.5 + */ scaleMin: number; - /** 定义缩放倍数最大值，默认为 10。 */ + /** + * @desc 定义缩放倍数最大值 + * @desc 默认为 10 + */ scaleMax: number; - /** 定义缩放倍数，取值范围为 0.5 - 10 */ + /** + * @desc 定义缩放倍数，取值范围为 0.5 - 10 + * @desc 默认为 1 + */ scaleValue: number; - /** 是否使用动画，默认为 true。 */ + /** + * @desc 是否使用动画 + * @desc 默认为 true + */ animation: boolean; + /** + * @desc 拖动过程中触发 + */ + onChange: (event: TMovableViewChangeEvent) => void; + /** + * @desc 缩放过程中触发 + */ + onScale: (event: TMovableViewScaleEvent) => void; }, {} >; From 7f8c2f5c97e90ca382823485033e9398e9e918be Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 15:28:18 +0800 Subject: [PATCH 22/59] feat: update cover-view and cover-image types --- index.d.ts | 64 ++++++++++++++++++++++++++++++++++++++++-------------- 1 file changed, 48 insertions(+), 16 deletions(-) diff --git a/index.d.ts b/index.d.ts index 667e634..5629891 100644 --- a/index.d.ts +++ b/index.d.ts @@ -684,6 +684,48 @@ type TMovableView = TComponent< {} >; +/** + * @desc 覆盖在原生组件之上的文本视图 + * @desc app-vue 和小程序框架，渲染引擎是 webview + * @desc 为了优化体验，部分组件如 map、video、textarea、canvas 通过原生控件实现，原生组件层级高于前端组件 + * @desc 为了能正常覆盖原生组件，设计了cover-view + */ +type TCoverView = TComponent< + { + /** + * @desc 设置顶部滚动偏移量 + * @desc 仅在设置了 overflow-y: scroll 成为滚动元素后生效 + */ + scrollTop: number | string; + }, + {} +>; + +/** + * @desc 覆盖在原生组件之上的图片视图 + * @desc 可覆盖的原生组件同 cover-view + * @desc 支持嵌套在 cover-view 里 + */ +type TCoverImage = TComponent< + { + /** + * @desc 图片路径 + * @desc 支持本地路径、网络路径 + * @desc 不支持 base64 格式 + */ + src: string; + /** + * @desc 图片加载成功时触发 + */ + onLoad: (event: TBaseEvent) => void; + /** + * @desc 图片加载失败时触发 + */ + onError: (event: TBaseEvent) => void; + }, + {} +>; + /** 文本 */ type TText = TComponent< { @@ -1243,18 +1285,6 @@ type TWebView = TComponent< {} >; -/** 覆盖在原生组件之上的文本视图，可覆盖的原生组件包括map、video、canvas、camera，只支持嵌套cover-view、cover-image */ -type TCoverView = TComponent<{}, {}>; - -/** 覆盖在原生组件之上的图片视图，可覆盖的原生组件同cover-view，支持嵌套在cover-view里。 */ -type TCoverImage = TComponent< - { - /** webview 指向网页的链接 */ - src: string | string; - }, - {} ->; - /** 图标 */ type TIcon = TComponent< { @@ -1519,11 +1549,14 @@ declare module "@vue/runtime-core" { Block: TBlock; View: TView; ScrollView: TScrollView; - MatchMedia: TMatchMedia; Swiper: TSwiper; SwiperItem: TSwiperItem; - MovableView: TMovableView; + MatchMedia: TMatchMedia; MovableArea: TMovableArea; + MovableView: TMovableView; + CoverView: TCoverView; + CoverImage: TCoverImage; + Text: TText; RichText: TRichText; Progress: TProgress; @@ -1547,8 +1580,7 @@ declare module "@vue/runtime-core" { Map: TMap; Canvas: TCanvas; WebView: TWebView; - CoverView: TCoverView; - CoverImage: TCoverImage; + Icon: TIcon; PickerViewColumn: TPickerViewColumn; Camera: TCamera; From 45477d67262c3b352205f586d5dac442a2f3183e Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 15:32:36 +0800 Subject: [PATCH 23/59] feat: update icon types --- index.d.ts | 39 ++++++++++++++++++++++++--------------- 1 file changed, 24 insertions(+), 15 deletions(-) diff --git a/index.d.ts b/index.d.ts index 5629891..cd828d7 100644 --- a/index.d.ts +++ b/index.d.ts @@ -726,6 +726,29 @@ type TCoverImage = TComponent< {} >; +/** + * @desc 图标 + */ +type TIcon = TComponent< + { + /** + * @desc icon 的类型 + */ + type: string; + /** + * @desc icon 的大小 + * @desc 单位为 px + * @desc 默认为 23 + */ + size: number; + /** + * @desc icon 的颜色 + */ + color: string; + }, + {} +>; + /** 文本 */ type TText = TComponent< { @@ -1285,19 +1308,6 @@ type TWebView = TComponent< {} >; -/** 图标 */ -type TIcon = TComponent< - { - /** 开放数据类型 */ - type: string; - /** 按钮的大小 */ - size: "default" | "mini"; - /** switch 的颜色，同 css 的 color */ - color: string; - }, - {} ->; - /** 仅可放置于 picker-view 中，其孩子节点的高度会自动设置成与picker-view的选中框的高度一致 */ type TPickerViewColumn = TComponent< { @@ -1556,6 +1566,7 @@ declare module "@vue/runtime-core" { MovableView: TMovableView; CoverView: TCoverView; CoverImage: TCoverImage; + Icon: TIcon; Text: TText; RichText: TRichText; @@ -1580,8 +1591,6 @@ declare module "@vue/runtime-core" { Map: TMap; Canvas: TCanvas; WebView: TWebView; - - Icon: TIcon; PickerViewColumn: TPickerViewColumn; Camera: TCamera; LivePlayer: TLivePlayer; From 4219f0d6d69c5d4ca85874e9142a23221c164583 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 15:35:45 +0800 Subject: [PATCH 24/59] feat: update text types --- index.d.ts | 27 ++++++++++++++++++++++----- 1 file changed, 22 insertions(+), 5 deletions(-) diff --git a/index.d.ts b/index.d.ts index cd828d7..aaabea2 100644 --- a/index.d.ts +++ b/index.d.ts @@ -749,14 +749,31 @@ type TIcon = TComponent< {} >; -/** 文本 */ +/** + * @desc 文本组件 + * @desc 用于包裹文本内容 + */ type TText = TComponent< { - /** 文本是否可选 */ + /** + * @desc 文本是否可选 + * @desc 默认为 false + */ selectable: boolean; - /** 显示连续空格 */ + /** + * @desc 文本是否可选，可能会使文本节点显示为 inline-block + * @desc 默认为 false + */ + userSelect: boolean; + /** + * @desc 显示连续空格 + * @desc 没有默认值 + */ space: "ensp" | "emsp" | "nbsp"; - /** 是否解码 */ + /** + * @desc 是否解码 + * @desc 默认为 false + */ decode: boolean; }, {} @@ -1567,8 +1584,8 @@ declare module "@vue/runtime-core" { CoverView: TCoverView; CoverImage: TCoverImage; Icon: TIcon; - Text: TText; + RichText: TRichText; Progress: TProgress; Button: TButton; From ab5218df0f61ae9d1c5c5ee6d53085ec409664df Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 15:51:40 +0800 Subject: [PATCH 25/59] feat: update rich-text types --- index.d.ts | 67 ++++++++++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 63 insertions(+), 4 deletions(-) diff --git a/index.d.ts b/index.d.ts index aaabea2..3c01993 100644 --- a/index.d.ts +++ b/index.d.ts @@ -779,11 +779,70 @@ type TText = TComponent< {} >; -/** 富文本 */ +/** + * @desc rich-text 文本节点 + */ +type TRichTextTextNode = { + type: "text"; + text: string; +}; +/** + * @desc rich-text 元素节点 + */ +type TRichTextNodeNode = { + type?: "node"; + name: string; + attrs?: Record; + children?: Array; +}; +/** + * @desc rich-text 节点 + */ +type TRichTextNode = TRichTextTextNode | TRichTextNodeNode; +/** + * @desc rich-text itemclick 事件对象 + */ +type TRichTextItemclickEvent = TBaseEvent & { + detail: { + node: TRichTextNode; + }; +}; +/** + * @desc 富文本 + * */ type TRichText = TComponent< { - /** 节点列表 */ - nodes: any[]; + /** + * @desc 节点列表 + * @desc + */ + nodes: TRichTextNode[] | string; + /** + * @desc 显示连续空格 + * @desc 没有默认值 + */ + space: "ensp" | "emsp" | "nbsp"; + /** + * @desc 富文本是否可以长按选中 + * @desc 默认为 true + */ + selectable: boolean; + /** + * @desc 是否阻止长按图片时弹起默认菜单 + * @desc 只在初始化时有效，不能动态变更 + * @desc 默认为 false + */ + imageMenuPrevent: boolean; + /** + * @desc 富文本中的图片是否可点击预览 + * @desc 在不设置的情况下，若 rich-text 未监听点击事件，则默认开启 + * @desc 未显示设置 preview 时会进行点击默认预览判断，建议显示设置 preview + */ + preview: boolean; + /** + * @desc 拦截点击事件，支持 a 和 img 标签 + */ + onItemclick: (event: TRichTextItemclickEvent) => void; }, {} >; @@ -1585,8 +1644,8 @@ declare module "@vue/runtime-core" { CoverImage: TCoverImage; Icon: TIcon; Text: TText; - RichText: TRichText; + Progress: TProgress; Button: TButton; CheckboxGroup: TCheckboxGroup; From da52b7e8f2d37856a7162f622c0cab8bfb72a4b4 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 15:59:18 +0800 Subject: [PATCH 26/59] feat: update progress types --- index.d.ts | 72 ++++++++++++++++++++++++++++++++++++++++++++---------- 1 file changed, 59 insertions(+), 13 deletions(-) diff --git a/index.d.ts b/index.d.ts index 3c01993..ccfe2c3 100644 --- a/index.d.ts +++ b/index.d.ts @@ -663,7 +663,8 @@ type TMovableView = TComponent< */ scaleMax: number; /** - * @desc 定义缩放倍数，取值范围为 0.5 - 10 + * @desc 定义缩放倍数 + * @desc 取值范围为 0.5 - 10 * @desc 默认为 1 */ scaleValue: number; @@ -847,25 +848,68 @@ type TRichText = TComponent< {} >; -/** 进度条 */ +/** + * @desc 进度条 + */ type TProgress = TComponent< { - /** 百分比0~100 */ + /** + * @desc 百分比 + * @desc 取值范围为 0 - 100 + * @desc 没有默认值 + */ percent: number; - /** 在进度条右侧显示百分比 */ + /** + * @desc 是否在进度条右侧显示百分比 + * @desc 默认为 false + */ showInfo: boolean; - /** 进度条线的宽度，单位px */ + /** + * @desc 圆角大小 + * @desc 默认为 0 + */ + borderRadius: number | string; + /** + * @desc 进度条右侧显示的百分比字体大小 + * @desc 默认为 16 + */ + fontSize: number | string; + /** + * @desc 进度条线的宽度 + * @desc 单位为 px + * @desc 默认为 6 + */ strokeWidth: number; - /** switch 的颜色，同 css 的 color */ - color: string; - /** radio已选择的颜色 */ + /** + * @desc 已选择的进度条的颜色 + * @desc 默认为 #09bb07，百度默认为 #e6e6e6 + */ activeColor: string; - /** radio背景条的颜色 */ + /** + * @desc 未选择的进度条的颜色 + * @desc 默认为 #ebebeb + */ backgroundColor: string; - /** 进度条从左往右的动画 */ + /** + * @desc 是否显示进度条从左往右的动画 + * @desc 默认为 false + */ active: boolean; - /** backwards: 动画从头播；forwards：动画从上次结束点接着播 */ - activeMode: string; + /** + * @desc 动画播放方式 + * @desc 默认为 backwards + */ + activeMode: "backwards" | "forwards"; + /** + * @desc 进度增加 1% 所需时间 + * @desc 单位为 ms + * @desc 默认为 30 + */ + duration: number; + /** + * @desc 动画完成时触发 + */ + onActiveend: (event: TBaseEvent) => void; }, {} >; @@ -1633,6 +1677,7 @@ type TUnicloudDb = TComponent< declare module "@vue/runtime-core" { export interface GlobalComponents { Block: TBlock; + View: TView; ScrollView: TScrollView; Swiper: TSwiper; @@ -1642,11 +1687,12 @@ declare module "@vue/runtime-core" { MovableView: TMovableView; CoverView: TCoverView; CoverImage: TCoverImage; + Icon: TIcon; Text: TText; RichText: TRichText; - Progress: TProgress; + Button: TButton; CheckboxGroup: TCheckboxGroup; Checkbox: TCheckbox; From 7558a46f32584d3886ebb49cfddaaa63ac4237f8 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 16:04:02 +0800 Subject: [PATCH 27/59] =?UTF-8?q?chore:=20=E6=8C=89=20uniapp=20=E6=96=87?= =?UTF-8?q?=E6=A1=A3=E9=87=8D=E6=96=B0=E6=8E=92=E5=BA=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.d.ts | 32 ++++++++++++++++++++++++-------- 1 file changed, 24 insertions(+), 8 deletions(-) diff --git a/index.d.ts b/index.d.ts index ccfe2c3..2ab73d6 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1696,34 +1696,50 @@ declare module "@vue/runtime-core" { Button: TButton; CheckboxGroup: TCheckboxGroup; Checkbox: TCheckbox; + Editor: TEditor; Form: TForm; Input: TInput; Label: TLabel; Picker: TPicker; PickerView: TPickerView; + PickerViewColumn: TPickerViewColumn; RadioGroup: TRadioGroup; Radio: TRadio; Slider: TSlider; Switch: TSwitch; Textarea: TTextarea; + Navigator: TNavigator; + Audio: TAudio; + Camera: TCamera; Image: TImage; Video: TVideo; + LivePlayer: TLivePlayer; + LivePusher: TLivePusher; + Map: TMap; + Canvas: TCanvas; + WebView: TWebView; - PickerViewColumn: TPickerViewColumn; - Camera: TCamera; - LivePlayer: TLivePlayer; - LivePusher: TLivePusher; - OpenData: TOpenData; + Ad: TAd; AdDraw: TAdDraw; + + UnicloudDb: TUnicloudDb; + + PageMeta: TPageMeta; NavigationBar: TNavigationBar; CustomTabBar: TCustomTabBar; - PageMeta: TPageMeta; - Editor: TEditor; - UnicloudDb: TUnicloudDb; + + Barcode: TBarcode; + List: TList; + Cell: TCell; + RecycleList: TRecycleList; + Waterfall: TWaterfall; + Refresh: TRefresh; + + OpenData: TOpenData; } } From 9502c8caf8ffa9fe022cbbbfbceb0e86f3cbeb23 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 16:30:47 +0800 Subject: [PATCH 28/59] feat: update event types --- index.d.ts | 27 ++++++++------------------- 1 file changed, 8 insertions(+), 19 deletions(-) diff --git a/index.d.ts b/index.d.ts index 2ab73d6..95a710d 100644 --- a/index.d.ts +++ b/index.d.ts @@ -31,7 +31,7 @@ type TComponent< /* ---- 通用事件对象 ---- */ /** - * @desc 基础事件对象 + * @desc 通用事件对象 */ type TBaseEvent = { /** @@ -72,26 +72,10 @@ type TBaseEvent = { * @desc 事件标记数据 */ mark?: Record; -}; - -/** - * @desc 自定义事件对象 - */ -type TCustomEvent = TBaseEvent & { - /** - * @desc 额外的信息 - */ - detail: Record; -}; - -/** - * @desc 触摸事件对象 - */ -type TTouchEvent = TBaseEvent & { /** * @desc 触摸事件，当前停留在屏幕中的触摸点信息的数组 */ - touches: { + touches?: { /** * @desc 触摸点的标识符 */ @@ -124,7 +108,7 @@ type TTouchEvent = TBaseEvent & { /** * @desc 触摸事件，当前变化的触摸点信息的数组 */ - changedTouches: { + changedTouches?: { /** * @desc 触摸点的标识符 */ @@ -154,6 +138,11 @@ type TTouchEvent = TBaseEvent & { */ y: number; }[]; + /** + * @desc 额外的信息 + */ + detail?: Record; + [key: string]: any; }; /* ---- 元素和对应事件对象 ---- */ From 9cb206e64e71129e3712d8a0859765fdd86963ec Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 16:37:15 +0800 Subject: [PATCH 29/59] feat: update button types --- index.d.ts | 214 ++++++++++++++++++++++++++++++++++++++++++++--------- 1 file changed, 180 insertions(+), 34 deletions(-) diff --git a/index.d.ts b/index.d.ts index 95a710d..45eccae 100644 --- a/index.d.ts +++ b/index.d.ts @@ -903,50 +903,196 @@ type TProgress = TComponent< {} >; -/** 按钮 */ +/** + * @desc 按钮 + */ type TButton = TComponent< { - /** 是否禁用。 */ - disabled: boolean; - /** 指定按下去的样式类。当 hover-class="none" 时，没有点击态效果 */ - hoverClass: string; - /** 指定是否阻止本节点的祖先节点出现点击态 */ - hoverStopPropagation: boolean; - /** 按住后多久出现点击态，单位毫秒 */ - hoverStartTime: number; - /** 手指松开后点击态保留时间，单位毫秒 */ - hoverStayTime: number; - /** 按钮的大小 */ + /** + * @desc 按钮的大小 + * @desc 默认为 default + */ size: "default" | "mini"; - /** 开放数据类型 */ - type: string; - /** 按钮是否镂空，背景色透明 */ + /** + * @desc 按钮的样式类型 + * @desc 默认为 default + */ + type: "primary" | "default" | "warn"; + /** + * @desc 按钮是否镂空，背景色透明 + * @desc 默认为 false + */ plain: boolean; - /** 是否在导航条显示 loading 加载提示 */ + /** + * @desc 是否禁用 + */ + disabled: boolean; + /** + * @desc 是否带 loading 图标 + * @desc 默认为 false + */ loading: boolean; - /** 用于 form 组件，点击分别会触发 form 组件的 submit/reset 事件 */ + /** + * @desc 用于 form 组件，点击分别会触发 form 组件的 submit / reset 事件 + * @desc 没有默认值 + */ formType: "submit" | "reset"; - /** 跳转方式 */ + /** + * @desc 开放能力 + */ openType: - | "navigate" - | "redirect" - | "switchTab" - | "reLaunch" - | "navigateBack"; - /** */ - lang: "ts"; - /** 会话来源 */ + | "feedback" + | "share" + | "getUserInfo" + | "contact" + | "getPhoneNumber" + | "launchApp" + | "openSetting" + | "chooseAvatar" + | "getAuthorize" + | "lifestyle" + | "contactShare" + | "openGroupProfile" + | "openGuildProfile" + | "openPublicProfile" + | "shareMessageToFriend" + | "addFriend" + | "addColorSign" + | "addGroupApp" + | "addToFavorites" + | "chooseAddress" + | "chooseInvoiceTitle" + | "login" + | "subscribe" + | "favorite" + | "watchLater" + | "openProfile"; + /** + * @desc 指定按下去的样式类 + * @desc 当 hover-class="none" 时，没有点击态效果 + * @desc 默认为 button-hover + */ + hoverClass: string; + /** + * @desc 按住后多久出现点击态 + * @desc 单位为 ms + * @desc 默认为 20 + */ + hoverStartTime: number; + /** + * @desc 手指松开后点击态保留时间 + * @desc 单位为 ms + * @desc 默认为 70 + */ + hoverStayTime: number; + /** + * @desc 打开 APP 时，向 APP 传递的参数 + * @desc open-type="launchApp" 时有效 + */ + appParameter: string; + /** + * @desc 指定是否阻止本节点的祖先节点出现点击态 + * @desc 默认为 false + */ + hoverStopPropagation: boolean; + /** + * @desc 指定返回用户信息的语言 + */ + lang: "zh_CN" | "zh_TW" | "en"; + /** + * @desc 会话来源 + * @desc open-type="contact" 时有效 + */ sessionFrom: string; - /** 会话内消息卡片标题 */ + /** + * @desc 会话内消息卡片标题 + * @desc open-type="contact" 时有效 + * @desc 默认为当前标题 + */ sendMessageTitle: string; - /** 会话内消息卡片点击跳转应用路径 */ + /** + * @desc 会话内消息卡片点击跳转小程序路径 + * @desc open-type="contact" 时有效 + * @desc 默认为当前分享路径 + */ sendMessagePath: string; - /** 会话内消息卡片图片 */ + /** + * @desc 会话内消息卡片图片 + * @desc open-type="contact" 时有效 + * @desc 默认为截图 + */ sendMessageImg: string; - /** 显示会话内消息卡片 */ + /** + * @desc 是否显示会话内消息卡片 + * @desc 设置此参数为 true，用户进入客服会话会在右下角显示"可能要发送的小程序"提示，用户点击后可以快速发送小程序消息 + * @desc open-type="contact" 时有效 + * @desc 默认为 false + */ showMessageCard: boolean; - /** 打开 APP 时，向 APP 传递的参数 */ - appParameter: string; + /** + * @desc 打开群资料卡时，传递的群号 + * @desc open-type="openGroupProfile" 时有效 + */ + groupId: string; + /** + * @desc 打开频道页面时，传递的频道号 + * @desc open-type="openGuildProfile" 时有效 + */ + guildId: string; + /** + * @desc 打开公众号资料卡时，传递的号码 + * @desc open-type="openPublicProfile" 时有效 + */ + publicId: string; + /** + * @desc 获取用户手机号时回调 + * @desc open-type="getPhoneNumber" 时有效 + */ + onGetphonenumber: (event: TBaseEvent) => void; + /** + * @desc 使用开放能力发生错误时回调 + */ + onError: (event: TBaseEvent) => void; + /** + * @desc 在打开授权设置页并关闭后回调 + * @desc open-type="openSetting" 时有效 + */ + onOpensetting: (event: TBaseEvent) => void; + /** + * @desc 从小程序成功打开 APP 回调 + * @desc open-type="launchApp" 时有效 + */ + onLaunchapp: (event: TBaseEvent) => void; + /** + * @desc 获取用户头像回调 + * @desc open-type="chooseAvatar" 时有效 + */ + onChooseavatar: (event: TBaseEvent) => void; + /** + * @desc 添加群应用回调 + * @desc open-type="addGroupApp" 时有效 + */ + onAddgroupapp: (event: TBaseEvent) => void; + /** + * @desc 用户编辑并选择收货地址回调 + * @desc open-type="chooseAddress" 时有效 + */ + onChooseaddress: (event: TBaseEvent) => void; + /** + * @desc 用户选择发票抬头回调 + * @desc open-type="chooseInvoiceTitle" 时有效 + */ + onChooseinvoicetitle: (event: TBaseEvent) => void; + /** + * @desc 订阅消息授权回调 + * @desc open-type="subscribe" 时有效 + */ + onSubscribe: (event: TBaseEvent) => void; + /** + * @desc 登录回调 + * @desc open-type="login" 时有效 + */ + onLogin: (event: TBaseEvent) => void; }, {} >; @@ -1235,9 +1381,9 @@ type TNavigator = TComponent< hoverClass: string; /** 指定是否阻止本节点的祖先节点出现点击态 */ hoverStopPropagation: boolean; - /** 按住后多久出现点击态，单位毫秒 */ + /** 按住后多久出现点击态，单位为 ms */ hoverStartTime: number; - /** 手指松开后点击态保留时间，单位毫秒 */ + /** 手指松开后点击态保留时间，单位为 ms */ hoverStayTime: number; }, {} From ea7bd1a343d9983a604b8aa0957a98b63bb7a82b Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 16:37:34 +0800 Subject: [PATCH 30/59] feat: update event types --- index.d.ts | 54 +++++++++++++++++++++++++++--------------------------- 1 file changed, 27 insertions(+), 27 deletions(-) diff --git a/index.d.ts b/index.d.ts index 45eccae..c5f0889 100644 --- a/index.d.ts +++ b/index.d.ts @@ -33,7 +33,7 @@ type TComponent< /** * @desc 通用事件对象 */ -type TBaseEvent = { +type TEvent = { /** * @desc 事件类型 */ @@ -191,7 +191,7 @@ type TView = TComponent< /** * @desc scroll-view scroll 事件对象 */ -type TScrollViewScrollEvent = TBaseEvent & { +type TScrollViewScrollEvent = TEvent & { detail: { scrollLeft: number; scrollTop: number; @@ -300,11 +300,11 @@ type TScrollView = TComponent< /** * @desc 滚动到顶部/左边时触发 */ - onScrolltoupper: (event: TBaseEvent) => void; + onScrolltoupper: (event: TEvent) => void; /** * @desc 滚动到底部/右边时触发 */ - onScrolltolower: (event: TBaseEvent) => void; + onScrolltolower: (event: TEvent) => void; /** * @desc 滚动时触发 */ @@ -312,19 +312,19 @@ type TScrollView = TComponent< /** * @desc 自定义下拉刷新控件被下拉时触发 */ - onRefresherpulling: (event: TBaseEvent) => void; + onRefresherpulling: (event: TEvent) => void; /** * @desc 自定义下拉刷新被触发时触发 */ - onRefresherrefresh: (event: TBaseEvent) => void; + onRefresherrefresh: (event: TEvent) => void; /** * @desc 自定义下拉刷新被复位时触发 */ - onRefresherrestore: (event: TBaseEvent) => void; + onRefresherrestore: (event: TEvent) => void; /** * @desc 自定义下拉刷新被中止时触发 */ - onRefresherabort: (event: TBaseEvent) => void; + onRefresherabort: (event: TEvent) => void; }, {} >; @@ -332,7 +332,7 @@ type TScrollView = TComponent< /** * @desc swiper change 事件对象 */ -type TSwiperChangeEvent = TBaseEvent & { +type TSwiperChangeEvent = TEvent & { detail: { current: number; source: any; // TODO: better types @@ -341,7 +341,7 @@ type TSwiperChangeEvent = TBaseEvent & { /** * @desc swiper transition 事件对象 */ -type TSwiperTransitionEvent = TBaseEvent & { +type TSwiperTransitionEvent = TEvent & { detail: { dx: number; dy: number; @@ -350,7 +350,7 @@ type TSwiperTransitionEvent = TBaseEvent & { /** * @desc swiper animationfinish 事件对象 */ -type TSwiperAnimationfinishEvent = TBaseEvent & { +type TSwiperAnimationfinishEvent = TEvent & { detail: { current: number; source: any; // TODO: better types @@ -567,7 +567,7 @@ type TMovableArea = TComponent< /** * @desc movable-view change 事件对象 */ -type TMovableViewChangeEvent = TBaseEvent & { +type TMovableViewChangeEvent = TEvent & { detail: { x: number; y: number; @@ -577,7 +577,7 @@ type TMovableViewChangeEvent = TBaseEvent & { /** * @desc movable-view scale 事件对象 */ -type TMovableViewScaleEvent = TBaseEvent & { +type TMovableViewScaleEvent = TEvent & { detail: { x: number; y: number; @@ -707,11 +707,11 @@ type TCoverImage = TComponent< /** * @desc 图片加载成功时触发 */ - onLoad: (event: TBaseEvent) => void; + onLoad: (event: TEvent) => void; /** * @desc 图片加载失败时触发 */ - onError: (event: TBaseEvent) => void; + onError: (event: TEvent) => void; }, {} >; @@ -792,7 +792,7 @@ type TRichTextNode = TRichTextTextNode | TRichTextNodeNode; /** * @desc rich-text itemclick 事件对象 */ -type TRichTextItemclickEvent = TBaseEvent & { +type TRichTextItemclickEvent = TEvent & { detail: { node: TRichTextNode; }; @@ -898,7 +898,7 @@ type TProgress = TComponent< /** * @desc 动画完成时触发 */ - onActiveend: (event: TBaseEvent) => void; + onActiveend: (event: TEvent) => void; }, {} >; @@ -1048,51 +1048,51 @@ type TButton = TComponent< * @desc 获取用户手机号时回调 * @desc open-type="getPhoneNumber" 时有效 */ - onGetphonenumber: (event: TBaseEvent) => void; + onGetphonenumber: (event: TEvent) => void; /** * @desc 使用开放能力发生错误时回调 */ - onError: (event: TBaseEvent) => void; + onError: (event: TEvent) => void; /** * @desc 在打开授权设置页并关闭后回调 * @desc open-type="openSetting" 时有效 */ - onOpensetting: (event: TBaseEvent) => void; + onOpensetting: (event: TEvent) => void; /** * @desc 从小程序成功打开 APP 回调 * @desc open-type="launchApp" 时有效 */ - onLaunchapp: (event: TBaseEvent) => void; + onLaunchapp: (event: TEvent) => void; /** * @desc 获取用户头像回调 * @desc open-type="chooseAvatar" 时有效 */ - onChooseavatar: (event: TBaseEvent) => void; + onChooseavatar: (event: TEvent) => void; /** * @desc 添加群应用回调 * @desc open-type="addGroupApp" 时有效 */ - onAddgroupapp: (event: TBaseEvent) => void; + onAddgroupapp: (event: TEvent) => void; /** * @desc 用户编辑并选择收货地址回调 * @desc open-type="chooseAddress" 时有效 */ - onChooseaddress: (event: TBaseEvent) => void; + onChooseaddress: (event: TEvent) => void; /** * @desc 用户选择发票抬头回调 * @desc open-type="chooseInvoiceTitle" 时有效 */ - onChooseinvoicetitle: (event: TBaseEvent) => void; + onChooseinvoicetitle: (event: TEvent) => void; /** * @desc 订阅消息授权回调 * @desc open-type="subscribe" 时有效 */ - onSubscribe: (event: TBaseEvent) => void; + onSubscribe: (event: TEvent) => void; /** * @desc 登录回调 * @desc open-type="login" 时有效 */ - onLogin: (event: TBaseEvent) => void; + onLogin: (event: TEvent) => void; }, {} >; From 982c48d5d58c34975f1e756b9f4b811c41829042 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 16:45:02 +0800 Subject: [PATCH 31/59] feat: update checkbox types --- index.d.ts | 46 ++++++++++++++++++++++++++++++++++++++-------- 1 file changed, 38 insertions(+), 8 deletions(-) diff --git a/index.d.ts b/index.d.ts index c5f0889..83b930b 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1097,19 +1097,49 @@ type TButton = TComponent< {} >; -/** 多项选择器，内部由多个checkbox组成 */ -type TCheckboxGroup = TComponent<{}, {}>; +/** + * @desc checkbox-group change 事件对象 + */ +type TCheckboxGroupChangeEvent = TEvent & { + detail: { + value: string[]; + }; +}; +/** + * @desc 多项选择器，内部由多个 checkbox 组成 + */ +type TCheckboxGroup = TComponent< + { + /** + * @desc 选中项发生改变时触发 + */ + onChange: (event: TCheckboxGroupChangeEvent) => void; + }, + {} +>; -/** 多选项目 */ +/** + * @desc 多选项目 + */ type TCheckbox = TComponent< { - /** 是否禁用。 */ + /** + * @desc checkbox 标识 + * @desc 选中时触发 checkbox-group 的 change 事件并携带 value */ + value: string; + /** + * @desc 是否禁用 + * @desc 默认为 false + */ disabled: boolean; - /** radio当前取值 */ - value: number; - /** 是否选中 */ + /** + * @desc 当前是否选中，可用于设置默认选中 + * @desc 默认为 false + */ checked: boolean; - /** switch 的颜色，同 css 的 color */ + /** + * @desc checkbox 的颜色 + */ color: string; }, {} From 5f181938f756130749613699c756b4dd7e882570 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 17:04:24 +0800 Subject: [PATCH 32/59] feat: update editor types --- index.d.ts | 83 +++++++++++++++++++++++++++++++++++++++++++----------- 1 file changed, 66 insertions(+), 17 deletions(-) diff --git a/index.d.ts b/index.d.ts index 83b930b..168123f 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1145,6 +1145,72 @@ type TCheckbox = TComponent< {} >; +/** + * @desc editor focus、blur、input 事件对象 + */ +type TEditorEvent = TEvent & { + detail: { + html: string; + text: string; + delta: Record; + }; +}; +/** + * @desc 富文本编辑器，可以对图片、文字进行编辑和混排 + * @desc 编辑器导出内容支持带标签的 html 和纯文本的 text，编辑器内部采用 delta 格式进行存储 + * @desc 通过 setContents 接口设置内容时，解析插入的 html 可能会由于一些非法标签导致解析错误，建议开发者在应用内使用时通过 delta 进行插入 + * @desc 图片控件仅初始化时设置有效 + */ +type TEditor = TComponent< + { + /** + * @desc 是否只读 + * @desc 默认为 false + */ + readOnly: boolean; + /** + * @desc 提示信息 + */ + placeholder: string; + /** + * @desc 点击图片时是否显示图片大小控件 + * @desc 默认为 false + */ + showImgSize: boolean; + /** + * @desc 点击图片时是否显示工具栏控件 + * @desc 默认为 false + */ + showImgToolbar: boolean; + /** + * @desc 点击图片时是否显示修改尺寸控件 + * @desc 默认为 false + */ + showImgResize: string; + /** + * @desc 编辑器初始化完成时触发 + */ + onReady: (event: TEvent) => void; + /** + * @desc 编辑器聚焦时触发 + */ + onFocus: (event: TEditorEvent) => void; + /** + * @desc 编辑器失焦时触发 + */ + onBlur: (event: TEditorEvent) => void; + /** + * @desc 编辑器内容改变时触发 + */ + onInput: (event: TEditorEvent) => void; + /** + * @desc 通过 Context 方法改变编辑器内样式时触发，返回选区已设置的样式 + */ + onStatuschange: (event: TEvent) => void; + }, + {} +>; + /** 表单 */ type TForm = TComponent< { @@ -1781,23 +1847,6 @@ type TPageMeta = TComponent< {} >; -/** 富文本编辑器，可以对图片、文字进行编辑。 */ -type TEditor = TComponent< - { - /** 设置编辑器为只读。 */ - readOnly: boolean; - /** 提示信息。 */ - placeholder: string; - /** 点击图片时显示图片大小控件。 */ - showImgSize: boolean; - /** 点击图片时显示工具栏控件。 */ - showImgToolbar: boolean; - /** 点击图片时显示修改尺寸控件。 */ - showImgResize: string; - }, - {} ->; - /** 是一个数据库查询组件，它是对uni-clientdb的js库的再封装。 */ type TUnicloudDb = TComponent< { From 934526903c7a07d6e82a748d2aa112edc5f086b9 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 17:12:43 +0800 Subject: [PATCH 33/59] fix: fix checkbox types --- index.d.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/index.d.ts b/index.d.ts index 168123f..2415053 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1123,6 +1123,10 @@ type TCheckboxGroup = TComponent< */ type TCheckbox = TComponent< { + /** + * @desc 在 form 中作为 key + */ + name: string; /** * @desc checkbox 标识 * @desc 选中时触发 checkbox-group 的 change 事件并携带 value */ From 643e96b981723428cb018ddc6fc5fdf060d7307a Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 17:20:01 +0800 Subject: [PATCH 34/59] feat: update form types --- index.d.ts | 40 ++++++++++++++++++++++++++++++++++++---- 1 file changed, 36 insertions(+), 4 deletions(-) diff --git a/index.d.ts b/index.d.ts index 2415053..8b35ccd 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1215,13 +1215,45 @@ type TEditor = TComponent< {} >; -/** 表单 */ +/** + * @desc form submit 事件对象 + */ +type TFormSubmitEvent = TEvent & { + detail: { + value: { + [key: string]: number | string | boolean; + }; + formId?: string; + }; +}; +/** + * @desc 表单 + * @desc 将组件内的用户输入的 switch、input、checkbox、slider、radio、picker 提交 + */ type TForm = TComponent< { - /** 是否禁用。 */ - disabled: boolean; - /** 是否返回 formId 用于发送模板消息 */ + /** + * @desc 是否返回 formId 用于发送模板消息 + * @desc 默认为 false + */ reportSubmit: boolean; + /** + * @desc 等待一段时间以确认 formId 是否生效 + * @desc 如果未指定这个参数，formId 有很小的概率无效（网络问题） + * @desc 指定这个参数将可以检测 formId 是否有效，以这个参数的时间作为这项检测的超时时间 + * @desc 如果无效，将返回 requestFormId:fail 开头的 formId + * @desc 单位为 ms + * @desc 默认为 0 + */ + reportSubmitTimeout: number; + /** + * @desc 表单提交时触发 + */ + onSubmit: (event: TFormSubmitEvent) => void; + /** + * @desc 表单重置时触发 + */ + onReset: (event: TEvent) => void; }, {} >; From 786fd8cb9ec0d6c9cc73af455c19e904177cd023 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 20:47:54 +0800 Subject: [PATCH 35/59] feat: update input types --- index.d.ts | 227 ++++++++++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 206 insertions(+), 21 deletions(-) diff --git a/index.d.ts b/index.d.ts index 8b35ccd..616ef8a 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1258,43 +1258,228 @@ type TForm = TComponent< {} >; +/** + * @desc input input 事件对象 + */ +type TInputInputEvent = TEvent & { + detail: { + value: string; + }; +}; +/** + * @desc input focus 事件对象 + */ +type TInputFocusEvent = TEvent & { + detail: { + value: string; + height: number; + }; +}; +/** + * @desc input blur 事件对象 + */ +type TInputBlurEvent = TEvent & { + detail: { + value: string; + }; +}; +/** + * @desc input confirm 事件对象 + */ +type TInputConfirmEvent = TEvent & { + detail: { + value: string; + }; +}; +/** + * @desc input keyboardheightchange 事件对象 + */ +type TInputKeyboardheightchangeEvent = TEvent & { + detail: { + height: number; + duration: number; + }; +}; /** 输入框 */ type TInput = TComponent< { - /** 是否禁用。 */ - disabled: boolean; - /** radio当前取值 */ - value: number; - /** 开放数据类型 */ - type: string; - /** 是否是密码类型 */ + /** + * @desc 在 form 中作为 key + */ + name: string; + /** + * @desc 输入框的初始内容 + */ + value: string; + /** + * @desc input 类型 + * @desc 默认为 text + */ + type: + | "text" + | "number" + | "idcard" + | "digit" + | "tel" + | "safe-password" + | "nickname"; + /** + * @desc 文本区域的语义，根据类型自动填充 + */ + textContentType: "oneTimeCode"; + /** + * @desc 是否是密码类型 + * @desc 默认为 false + */ password: boolean; - /** 提示信息。 */ + /** + * @desc 输入框为空时占位符 + */ placeholder: string; - /** 指定 placeholder 的样式 */ + /** + * @desc 指定 placeholder 的样式 + */ placeholderStyle: string; - /** 指定 placeholder 的样式类 */ + /** + * @desc 指定 placeholder 的样式类 + * @desc 默认为 input-placeholder + */ placeholderClass: string; - /** 最大输入长度，设置为 -1 的时候不限制最大长度 */ + /** + * @desc 是否禁用 + * @desc 默认为 false + */ + disabled: boolean; + /** + * @desc 最大输入长度 + * @desc 设置为 -1 的时候不限制最大长度 + * @desc 默认为 140 + */ maxlength: number; - /** 指定光标与键盘的距离，单位 px 。取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 */ + /** + * @desc 指定光标与键盘的距离 + * @desc 取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 + * @desc 单位为 px + * @desc 默认为 0 + */ cursorSpacing: number; - /** 获取焦点 */ - autoFocus: boolean; - /** 获取焦点 */ + /** + * @desc 是否获取焦点 + * @desc 默认为 false + */ focus: boolean; - /** 设置键盘右下角按钮的文字 */ + /** + * @desc 设置键盘右下角按钮的文字 + * @desc type="text" 时生效 + */ confirmType: "send" | "search" | "next" | "go" | "done"; - /** 点击键盘右下角按钮时是否保持键盘不收起 */ + /** + * @desc 点击键盘右下角按钮时是否保持键盘不收起 + * @desc 默认为 false + */ confirmHold: boolean; - /** 指定focus时的光标位置 */ + /** + * @desc 指定 focus 时的光标位置 + */ cursor: number; - /** 光标起始位置，自动聚集时有效，需与selection-end搭配使用 */ + /** + * @desc 光标起始位置，自动聚焦时有效，需与 selection-end 搭配使用 + * @desc 默认为 -1 + */ selectionStart: number; - /** 光标结束位置，自动聚集时有效，需与selection-satrt搭配使用 */ + /** + * @desc 光标结束位置，自动聚焦时有效，需与 selection-start 搭配使用 + * @desc 默认为 -1 + */ selectionEnd: number; - /** 键盘弹起时，是否自动上推页面 */ + /** + * @desc 键盘弹起时，是否自动上推页面 + * @desc 默认为 true + */ adjustPosition: boolean; + /** + * @desc 聚焦时，点击页面的时候是否不收起键盘 + * @desc 默认为 false + */ + holdKeyboard: boolean; + /** + * @desc 键盘收起时，是否自动失焦 + * @desc 默认为 false + */ + autoBlur: boolean; + /** + * @desc 是否忽略组件内对文本合成系统事件的处理 + * @desc 为 false 时将触发 compositionstart、compositionend、compositionupdate 事件，且在文本合成期间会触发 input 事件 + * @desc 默认为 true + */ + ignoreCompositionEvent: boolean; + /** + * @desc 是否强制 input 处于同层状态，仅在 iOS 生效 + * @desc 默认聚焦时 input 会切到非同层状态 + * @desc 默认为 false + */ + alwaysEmbed: boolean; + /** + * @desc 安全键盘加密公钥的路径，只支持包内路径 + */ + safePasswordCertPath: string; + /** + * @desc 安全键盘输入密码长度 + */ + safePasswordLength: number; + /** + * @desc 安全键盘加密时间戳 + */ + safePasswordTimeStamp: number; + /** + * @desc 安全键盘加密盐值 + */ + safePasswordNonce: string; + /** + * @desc 安全键盘计算 hash 盐值，若指定 custom-hash 则无效 + */ + safePasswordSalt: string; + /** + * @desc 安全键盘计算 hash 的算法表达式 + */ + safePasswordCustomHash: string; + /** + * @desc 当 type 为 number、digit、idcard 时，数字键盘是否随机排列 + * @desc 默认为 false + */ + randomNumber: boolean; + /** + * @desc 是否为受控组件 + * @desc 为 true 时，value 内容会完全受 setData 控制 + * @desc 默认为 false + */ + controlled: boolean; + /** + * @desc 是否强制使用系统键盘和 Web-view 创建的 input 元素 + * @desc 为 true 时，confirm-type、confirm-hold 可能失效 + * @desc 默认为 false + */ + alwaysSystem: boolean; + /** + * @desc 输入时触发 + */ + onInput: (event: TInputInputEvent) => string | void; + /** + * @desc 聚焦时触发 + */ + onFocus: (event: TInputFocusEvent) => void; + /** + * @desc 失焦时触发 + */ + onBlur: (event: TInputBlurEvent) => void; + /** + * @desc 点击完成按钮时触发 + */ + onConfirm: (event: TInputConfirmEvent) => void; + /** + * @desc 键盘高度变化时触发 + */ + onKeyboardheightchange: (event: TInputKeyboardheightchangeEvent) => void; }, {} >; From 052448d03da51b84d4cc3aeb7818373509b6d0c0 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 20:49:16 +0800 Subject: [PATCH 36/59] feat: update label types --- index.d.ts | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/index.d.ts b/index.d.ts index 616ef8a..3311016 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1484,12 +1484,16 @@ type TInput = TComponent< {} >; -/** 用来改进表单组件的可用性，使用for属性找到对应的id，或者将控件放在该标签下，当点击时，就会触发对应的控件 */ +/** + * @desc 用来改进表单组件的可用性 + * @desc 使用 for 属性找到对应的 id，或者将控件放在该标签下，当点击时，就会触发对应的控件 + * @desc for 优先级高于内部控件，内部有多个控件的时候默认触发第一个控件 + */ type TLabel = TComponent< { - /** 是否禁用。 */ - disabled: boolean; - /** 绑定控件的 id */ + /** + * @desc 绑定控件的 id + */ for: string; }, {} From 5ca1e8f3127b57468f32d6b7120f3cec43860aa1 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Wed, 13 Jul 2022 22:19:57 +0800 Subject: [PATCH 37/59] feat: update picker types --- index.d.ts | 257 ++++++++++++++++++++++++++++++++++++++++++++++++++--- 1 file changed, 243 insertions(+), 14 deletions(-) diff --git a/index.d.ts b/index.d.ts index 3311016..44f5920 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1499,27 +1499,256 @@ type TLabel = TComponent< {} >; -/** 从底部弹起的滚动选择器，现支持五种选择器，通过mode来区分，分别是普通选择器，多列选择器，时间选择器，日期选择器，省市区选择器，默认是普通选择器。 */ +/** + * @desc picker (selector) change 事件对象 + */ +type TPickerSelectorChangeEvent = TEvent & { + detail: { + value: number; + }; +}; +/** + * @desc picker (multiSelector) change 事件对象 + */ +type TPickerMultiSelectorChangeEvent = TEvent & { + detail: { + value: number[]; + }; +}; +/** + * @desc picker (multiSelector) columnchange 事件对象 + */ +type TPickerMultiSelectorColumnChangeEvent = TEvent & { + detail: { + column: number; + value: number; + }; +}; +/** + * @desc picker (time) change 事件对象 + */ +type TPickerTimeChangeEvent = TEvent & { + detail: { + value: string; + }; +}; +/** + * @desc picker (date) change 事件对象 + */ +type TPickerDateChangeEvent = TEvent & { + detail: { + value: string; + }; +}; +/** + * @desc picker (region) change 事件对象 + */ +type TPickerRegionChangeEvent = TEvent & { + detail: { + value: string[]; + }; +}; +/** + * @desc 从底部弹起的滚动选择器，通过 mode 来区分 + */ type TPicker = TComponent< - { - /** 是否禁用。 */ + | { + /** + * @desc 在 form 中作为 key + */ + name: string; + /** + * @desc 设置为普通选择器 + */ + mode?: "selector"; + /** + * @desc 需要展示的内容 + * @desc 默认为 [] + */ + range: string[] | Record[]; + /** + * @desc 当 range 是一个 Object Array 时，通过 range-key 来指定 Object 中 key 的值作为选择器显示内容 + */ + rangeKey: string; + /** + * @desc 当前选择的下标 + * @desc 默认为 0 + */ + value: number; + /** + * @desc 大屏时 UI 类型，支持 picker、select、auto + * @desc 默认在 iPad 以 picker 样式展示 + * @desc 默认在 PC 以 select 样式展示 + * @desc 默认为 auto + */ + selectorType: "auto" | "picker" | "select"; + /** + * @desc 是否禁用 + * @desc 默认为 false + */ disabled: boolean; - /** selector 普通选择器, multiSelector 多列选择器, time 时间选择器, date 日期选择器, region 省市区选择器 */ - mode: "selector" | "multiSelector" | "time" | "date" | "region"; - /** mode为 selector 或 multiSelector 时，range 有效 */ - range: any[]; - /** 当 range 是一个 Object Array 时，通过 range-key 来指定 Object 中 key 的值作为选择器显示内容 */ + /** + * @desc value 改变时触发 + */ + onChange: (event: TPickerSelectorChangeEvent) => void; + /** + * @desc 取消选择时触发 + */ + onCancel: (event: TEvent) => void; + } + | { + /** + * @desc 在 form 中作为 key + */ + name: string; + /** + * @desc 设置为多列选择器 + */ + mode: "multiSelector"; + /** + * @desc 需要展示的内容 + * @desc 默认为 [] + */ + range: string[][] | Record[][]; + /** + * @desc 当 range 是一个 Object Array 时，通过 range-key 来指定 Object 中 key 的值作为选择器显示内容 + */ rangeKey: string; - /** radio当前取值 */ - value: number; - /** mode为time：表示有效时间范围的开始，字符串格式为"hh:mm"；mode为date：表示有效日期范围的开始，字符串格式为"YYYY-MM-DD" */ + /** + * @desc 当前每列选择的下标 + * @desc 默认为列数个 0 组成的数组 + */ + value: number[]; + /** + * @desc 是否禁用 + * @desc 默认为 false + */ + disabled: boolean; + /** + * @desc value 改变时触发 + */ + onChange: (event: TPickerMultiSelectorChangeEvent) => void; + /** + * @desc 某一列 value 改变时触发 + */ + onColumnchange: (event: TPickerMultiSelectorColumnchangeEvent) => void; + /** + * @desc 取消选择时触发 + */ + onCancel: (event: TEvent) => void; + } + | { + /** + * @desc 在 form 中作为 key + */ + name: string; + /** + * @desc 设置为时间选择器 + */ + mode: "time"; + /** + * @desc 选中的日期 + * @desc 格式为 hh:mm + */ + value: string; + /** + * @desc 有效日期范围的开始 + * @desc 格式为 hh:mm + */ + start: string; + /** + * @desc 有效日期范围的结束 + * @desc 格式为 hh:mm + */ + end: string; + /** + * @desc 是否禁用 + * @desc 默认为 false + */ + disabled: boolean; + /** + * @desc value 改变时触发 + */ + onChange: (event: TPickerTimeChangeEvent) => void; + /** + * @desc 取消选择时触发 + */ + onCancel: (event: TEvent) => void; + } + | { + /** + * @desc 在 form 中作为 key + */ + name: string; + /** + * @desc 设置为日期选择器 + */ + mode: "date"; + /** + * @desc 选中的日期 + * @desc 格式为 YYYY-MM-DD + */ + value: string; + /** + * @desc 有效日期范围的开始 + * @desc 格式为 YYYY-MM-DD + */ start: string; - /** mode为time：表示有效时间范围的结束，字符串格式为"hh:mm"；mode为date：表示有效日期范围的结束，字符串格式为"YYYY-MM-DD" */ + /** + * @desc 有效日期范围的结束 + * @desc 格式为 YYYY-MM-DD + */ end: string; - /** 有效值 year,month,day，表示选择器的粒度 */ + /** + * @desc 选择器的粒度 + * @desc 默认为 day + */ fields: "year" | "month" | "day"; - /** 可为每一列的顶部添加一个自定义的项 */ + /** + * @desc 是否禁用 + * @desc 默认为 false + */ + disabled: boolean; + /** + * @desc value 改变时触发 + */ + onChange: (event: TPickerDateChangeEvent) => void; + /** + * @desc 取消选择时触发 + */ + onCancel: (event: TEvent) => void; + } + | { + /** + * @desc 在 form 中作为 key + */ + name: string; + /** + * @desc 设置为省市区选择器 + */ + mode: "region"; + /** + * @desc 选中的省市区 + * @desc 默认选中每一列第一个值 + */ + value: string[]; + /** + * @desc 可为每一列的顶部添加一个自定义的项 + */ customItem: string; + /** + * @desc 是否禁用 + * @desc 默认为 false + */ + disabled: boolean; + /** + * @desc value 改变时触发 + */ + onChange: (event: TPickerRegionChangeEvent) => void; + /** + * @desc 取消选择时触发 + */ + onCancel: (event: TEvent) => void; }, {} >; From 24d99265d113c1c95f9dc6708de6f59640daf720 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 12:02:39 +0800 Subject: [PATCH 38/59] feat: update picker-view types --- index.d.ts | 70 ++++++++++++++++++++++++++++++++++++++++-------------- 1 file changed, 52 insertions(+), 18 deletions(-) diff --git a/index.d.ts b/index.d.ts index 44f5920..d4bb5df 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1753,25 +1753,68 @@ type TPicker = TComponent< {} >; -/** 嵌入页面的滚动选择器 */ +/** + * @desc picker-view change 事件对象 + */ +type TPickerViewChangeEvent = TEvent & { + detail: { + value: number[]; + }; +}; +/** + * @desc 嵌入页面的滚动选择器，比 picker 更灵活 + */ type TPickerView = TComponent< { - /** 是否禁用。 */ - disabled: boolean; - /** radio当前取值 */ - value: number; - /** 设置选择器中间选中框的样式 */ + /** + * @desc 依次表示 picker-view 内 picker-view-column 选择的下标 + * @desc 超出 picker-view-column 可选项长度时，选择最后一项 + */ + value: number[]; + /** + * @desc 设置选择器中间选中框的样式 + */ indicatorStyle: string; - /** 设置选择器中间选中框的类名 */ + /** + * @desc 设置选择器中间选中框的类名 + */ indicatorClass: string; - /** 设置蒙层的样式 */ + /** + * @desc 设置蒙层的样式 + */ maskStyle: string; - /** 设置蒙层的类名 */ + /** + * @desc 设置蒙层的类名 + */ maskClass: string; + /** + * @desc 是否在手指松开时立即触发 change 事件 + * @desc 若不开启则会在滚动动画结束后触发 change 事件 + * @desc 默认为 false + */ + immediateChange: boolean; + /** + * @desc value 改变时触发 + */ + onChange: (event: TPickerViewChangeEvent) => void; + /** + * @desc 滚动选择开始时触发 + */ + onPickstart: (event: TEvent) => void; + /** + * @desc 滚动选择结束时触发 + */ + onPickend: (event: TEvent) => void; }, {} >; +/** + * @desc picker-view 直接子组件 + * @desc 子节点的高度会自动设置成与 picker-view 的选中框的高度一致 + */ +type TPickerViewColumn = TComponent<{}, {}>; + /** 单项选择器，内部由多个 radio 组成 */ type TRadioGroup = TComponent< { @@ -2113,15 +2156,6 @@ type TWebView = TComponent< {} >; -/** 仅可放置于 picker-view 中，其孩子节点的高度会自动设置成与picker-view的选中框的高度一致 */ -type TPickerViewColumn = TComponent< - { - /** 是否禁用。 */ - disabled: boolean; - }, - {} ->; - /** 相机组件 */ type TCamera = TComponent< { From c3a4e58b6f3daf155156477241928a070aad93b4 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 12:08:24 +0800 Subject: [PATCH 39/59] feat: update radio types --- index.d.ts | 50 ++++++++++++++++++++++++++++++++++++++++---------- 1 file changed, 40 insertions(+), 10 deletions(-) diff --git a/index.d.ts b/index.d.ts index d4bb5df..48d8910 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1815,25 +1815,55 @@ type TPickerView = TComponent< */ type TPickerViewColumn = TComponent<{}, {}>; -/** 单项选择器，内部由多个 radio 组成 */ +/** + * @desc radio-group change 事件对象 + */ +type TRadioGroupChangeEvent = TEvent & { + detail: { + value: string; + }; +}; +/** + * @desc 单项选择器，内部由多个 radio 组成 + * @desc 通过把多个 radio 包裹在一个 radio-group 下，实现这些 radio 的单选 + */ type TRadioGroup = TComponent< { - /** 是否禁用。 */ - disabled: boolean; + /** + * @desc 选中项发生变化时触发 + */ + onChange: (event: TRadioGroupChangeEvent) => void; }, {} >; -/** 单选项目 */ +/** + * @desc 单选项目 + */ type TRadio = TComponent< { - /** 是否禁用。 */ - disabled: boolean; - /** radio当前取值 */ - value: number; - /** 是否选中 */ + /** + * @desc 在 form 中作为 key + */ + name: string; + /** + * @desc radio 标识 + * @desc 被选中时，radio-group 的 change 事件会携带该 value + */ + value: string; + /** + * @desc 当前是否选中 + * @desc 默认为 false + */ checked: boolean; - /** switch 的颜色，同 css 的 color */ + /** + * @desc 是否禁用 + * @desc 默认为 false + */ + disabled: boolean; + /** + * @desc radio 的颜色 + */ color: string; }, {} From e4008ed0ef64f949e986b8ceabda7b57076fc3b3 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 13:44:26 +0800 Subject: [PATCH 40/59] feat: update slider types --- index.d.ts | 89 ++++++++++++++++++++++++++++++++++++++++++++---------- 1 file changed, 73 insertions(+), 16 deletions(-) diff --git a/index.d.ts b/index.d.ts index 48d8910..3af83c0 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1869,33 +1869,90 @@ type TRadio = TComponent< {} >; -/** 滑动选择器 */ +/** + * @desc slider change 事件对象 + */ +type TSliderChangeEvent = TEvent & { + detail: { + value: number; + }; +}; +/** + * @desc slider changing 事件对象 + */ +type TSliderChangingEvent = TEvent & { + detail: { + value: number; + }; +}; +/** + * @desc 滑动选择器 + */ type TSlider = TComponent< { - /** 是否禁用。 */ - disabled: boolean; - /** radio 最小值 */ + /** + * @desc 在 form 中作为 key + */ + name: string; + /** + * @desc 最小值 + * @desc 默认为 0 + */ min: number; - /** radio最大值 */ + /** + * @desc 最大值 + * @desc 默认为 100 + */ max: number; - /** radio步长，取值必须大于 0，并且可被(max - min)整除 */ + /** + * @desc 步长，取值必须大于 0，并且可被 (max - min) 整除 + * @desc 默认为 1 + */ step: number; - /** radio当前取值 */ + /** + * @desc 是否禁用 + * @desc 默认为 false + */ + disabled: boolean; + /** + * @desc 当前取值 + * @desc 默认为 0 + */ value: number; - /** switch 的颜色，同 css 的 color */ - color: string; - /** radio已选择的颜色 */ - selectColor: string; - /** radio已选择的颜色 */ + /** + * @desc 滑块左侧已选择部分的线条颜色 + * @desc 默认为各平台默认色 + */ activeColor: string; - /** radio背景条的颜色 */ + /** + * @desc 滑块右侧背景条的颜色 + * @desc 默认为 #e9e9e9 + */ backgroundColor: string; - /** radio滑块的大小，取值范围为 12 - 28 */ + /** + * @desc 滑块的大小 + * @desc 取值范围为 12 - 28 + * @desc 默认为 28 + */ blockSize: number; - /** 滑块颜色 */ + /** + * @desc 滑块的颜色 + * @desc 默认为 #fff + */ blockColor: string; - /** 是否显示当前 value */ + /** + * @desc 是否显示当前 value + * @desc 默认为 false + */ showValue: boolean; + /** + * @desc 完成一次拖动后触发 + */ + onChange: (event: TSliderChangeEvent) => void; + /** + * @desc 拖动过程中触发 + */ + onChanging: (event: TSliderChangingEvent) => void; }, {} >; From 504cd6f2704c62119f83afc8f4106b091604a1b4 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 13:58:04 +0800 Subject: [PATCH 41/59] feat: update switch types --- index.d.ts | 42 +++++++++++++++++++++++++++++++++++------- 1 file changed, 35 insertions(+), 7 deletions(-) diff --git a/index.d.ts b/index.d.ts index 3af83c0..02b5e6f 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1957,17 +1957,45 @@ type TSlider = TComponent< {} >; -/** 开关选择器 */ +/** + * @desc switch change 事件对象 + */ +type TSwitchChangeEvent = TEvent & { + detail: { + value: boolean; + }; +}; +/** + * @desc 开关选择器 + */ type TSwitch = TComponent< { - /** 是否选中 */ + /** + * @desc 在 form 中作为 key + */ + name: string; + /** + * @desc 是否选中 + * @desc 默认为 false + */ checked: boolean; - /** 开放数据类型 */ - type: string; - /** switch 的颜色，同 css 的 color */ - color: string; - /** 是否禁用。 */ + /** + * @desc 是否禁用 + * @desc 默认为 false + */ disabled: boolean; + /** + * @desc 样式 + */ + type: "switch" | "checkbox"; + /** + * @desc switch 的颜色 + */ + color: string; + /** + * @desc checked 改变时触发 + */ + onChange: (event: TSwitchChangeEvent) => void; }, {} >; From 3c05a1fbac7c6abf93260e2e8ee950d3f4b01440 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 14:17:13 +0800 Subject: [PATCH 42/59] feat: update textarea types --- index.d.ts | 219 ++++++++++++++++++++++++++++++++++++++++++++++------- 1 file changed, 191 insertions(+), 28 deletions(-) diff --git a/index.d.ts b/index.d.ts index 02b5e6f..01e7be7 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1368,6 +1368,11 @@ type TInput = TComponent< * @desc 默认为 false */ focus: boolean; + /** + * @desc 是否自动聚焦，拉起键盘 + * @desc 默认为 false + */ + autoFocus: boolean; /** * @desc 设置键盘右下角按钮的文字 * @desc type="text" 时生效 @@ -1586,7 +1591,7 @@ type TPicker = TComponent< * @desc 是否禁用 * @desc 默认为 false */ - disabled: boolean; + disabled: boolean; /** * @desc value 改变时触发 */ @@ -1613,7 +1618,7 @@ type TPicker = TComponent< /** * @desc 当 range 是一个 Object Array 时，通过 range-key 来指定 Object 中 key 的值作为选择器显示内容 */ - rangeKey: string; + rangeKey: string; /** * @desc 当前每列选择的下标 * @desc 默认为列数个 0 组成的数组 @@ -1693,17 +1698,17 @@ type TPicker = TComponent< * @desc 有效日期范围的开始 * @desc 格式为 YYYY-MM-DD */ - start: string; + start: string; /** * @desc 有效日期范围的结束 * @desc 格式为 YYYY-MM-DD */ - end: string; + end: string; /** * @desc 选择器的粒度 * @desc 默认为 day */ - fields: "year" | "month" | "day"; + fields: "year" | "month" | "day"; /** * @desc 是否禁用 * @desc 默认为 false @@ -1735,7 +1740,7 @@ type TPicker = TComponent< /** * @desc 可为每一列的顶部添加一个自定义的项 */ - customItem: string; + customItem: string; /** * @desc 是否禁用 * @desc 默认为 false @@ -1749,7 +1754,7 @@ type TPicker = TComponent< * @desc 取消选择时触发 */ onCancel: (event: TEvent) => void; - }, + }, {} >; @@ -2000,41 +2005,199 @@ type TSwitch = TComponent< {} >; -/** 多行输入框 */ +/** + * @desc textarea focus 事件对象 + */ +type TTextareaFocusEvent = TEvent & { + detail: { + value: string; + height: number; + }; +}; +/** + * @desc textarea blur 事件对象 + */ +type TTextareaBlurEvent = TEvent & { + detail: { + value: string; + cursor: number; + }; +}; +/** + * @desc textarea linechange 事件对象 + */ +type TTextareaLinechangeEvent = TEvent & { + detail: { + height: number; + heightRpx: number; + lineCount: number; + }; +}; +/** + * @desc textarea input 事件对象 + */ +type TTextareaInputEvent = TEvent & { + detail: { + value: string; + cursor: number; + }; +}; +/** + * @desc textarea confirm 事件对象 + */ +type TTextareaConfirmEvent = TEvent & { + detail: { + value: string; + }; +}; +/** + * @desc textarea keyboardheightchange 事件对象 + */ +type TTextareaKeyboardheightchangeEvent = TEvent & { + detail: { + height: number; + duration: number; + }; +}; +/** + * @desc 多行输入框 + */ type TTextarea = TComponent< { - /** radio当前取值 */ - value: number; - /** 提示信息。 */ + /** + * @desc 输入框的内容 + */ + value: string; + /** + * @desc 输入框为空时占位符 + */ placeholder: string; - /** 指定 placeholder 的样式 */ + /** + * @desc 指定 placeholder 的样式 + */ placeholderStyle: string; - /** 指定 placeholder 的样式类 */ + /** + * @desc 指定 placeholder 的样式类 + * @desc 默认为 textarea-placeholder + */ placeholderClass: string; - /** 最大输入长度，设置为 -1 的时候不限制最大长度 */ + /** + * @desc 是否禁用 + * @desc 默认为 false + */ + disabled: boolean; + /** + * @desc 最大输入长度，设置为 -1 的时候不限制最大长度 + * @desc 默认为 140 + */ maxlength: number; - /** 获取焦点 */ - autoFocus: boolean; - /** 获取焦点 */ + /** + * @desc 是否获取焦点 + * @desc 默认为 false + */ focus: boolean; - /** 指定focus时的光标位置 */ - cursor: number; - /** 设置键盘右下角按钮的文字 */ - confirmType: "send" | "search" | "next" | "go" | "done"; - /** 是否自动增高，设置auto-height时，style.height不生效 */ + /** + * @desc 是否自动聚焦，拉起键盘 + * @desc 默认为 false + */ + autoFocus: boolean; + /** + * @desc 是否自动增高 + * @desc 设置时，样式里的 height 不生效 + * @desc 默认为 false + */ autoHeight: boolean; - /** 如果 textarea 是在一个 position:fixed 的区域，需要显示指定属性 fixed 为 true */ + /** + * @desc 如果 textarea 在 position: fixed 的区域内，需要指定为 true + * @desc 默认为 false + */ fixed: boolean; - /** 指定光标与键盘的距离，单位 px 。取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 */ + /** + * @desc 指定光标与键盘的距离 + * @desc 取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离 + * @desc 单位为 px + * @desc 默认为 0 + */ cursorSpacing: number; - /** 是否显示键盘上方带有”完成“按钮那一栏 */ + /** + * @desc 指定 focus 时的光标位置 + */ + cursor: number; + /** + * @desc 设置键盘右下角按钮的文字 + * @desc 默认为 done + */ + confirmType: "send" | "search" | "next" | "go" | "done"; + /** + * @desc 点击键盘右下角按钮时是否保持键盘不收起 + * @desc 默认为 false + */ + confirmHold: boolean; + /** + * @desc 是否显示键盘上方带有”完成“按钮那一栏 + * @desc 默认为 true + */ showConfirmBar: boolean; - /** 光标起始位置，自动聚集时有效，需与selection-end搭配使用 */ + /** + * @desc 光标起始位置，自动聚焦时有效，需与 selection-end 搭配使用 + * @desc 默认为 -1 + */ selectionStart: number; - /** 光标结束位置，自动聚集时有效，需与selection-satrt搭配使用 */ + /** + * @desc 光标结束位置，自动聚焦时有效，需与 selection-start 搭配使用 + * @desc 默认为 -1 + */ selectionEnd: number; - /** 键盘弹起时，是否自动上推页面 */ + /** + * @desc 键盘弹起时，是否自动上推页面 + * @desc 默认为 true + */ adjustPosition: boolean; + /** + * @desc 是否去掉 iOS 下的默认内边距 + * @desc 默认为 false + */ + disableDefaultPadding: boolean; + /** + * @desc 聚焦时点击页面的时候是否不收起键盘 + * @desc 默认为 false + */ + holdKeyboard: boolean; + /** + * @desc 键盘收起时是否自动失焦 + * @desc 默认为 false + */ + autoBlur: boolean; + /** + * @desc 是否忽略组件内对文本合成系统事件的处理 + * @desc 为 false 时将触发 compositionstart、compositionend、compositionupdate 事件，且在文本合成期间会触发 input 事件 + * @desc 默认为 true + */ + ignoreCompositionEvent: boolean; + /** + * @desc 聚焦时触发 + */ + onFocus: (event: TTextareaFocusEvent) => void; + /** + * @desc 失焦时触发 + */ + onBlur: (event: TTextareaBlurEvent) => void; + /** + * @desc 输入框行数变化时触发 + */ + onLinechange: (event: TTextareaLinechangeEvent) => void; + /** + * @desc 输入时触发 + */ + onInput: (event: TTextareaInputEvent) => string | void; + /** + * @desc 点击完成按钮时触发 + */ + onConfirm: (event: TTextareaConfirmEvent) => void; + /** + * @desc 键盘高度变化时触发 + */ + onKeyboardheightchange: (event: TTextareaKeyboardheightchangeEvent) => void; }, {} >; From c338a687d890145f15517504504a358b0e2ca592 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 14:33:52 +0800 Subject: [PATCH 43/59] feat: update navigator types --- index.d.ts | 119 +++++++++++++++++++++++++++++++++++++++-------------- 1 file changed, 88 insertions(+), 31 deletions(-) diff --git a/index.d.ts b/index.d.ts index 01e7be7..d1f514d 100644 --- a/index.d.ts +++ b/index.d.ts @@ -2202,60 +2202,117 @@ type TTextarea = TComponent< {} >; -/** 页面链接 */ +/** + * @desc 页面跳转 + */ type TNavigator = TComponent< { - /** 在哪个目标上发生跳转，默认当前应用 */ - target: string; - /** 推流地址。目前仅支持 flv, rtmp 格式 */ + /** + * @desc 应用内的跳转链接 + * @desc 值为相对路径或绝对路径 + * @desc 例子：../first/first、/pages/first/first + */ url: string; - /** 跳转方式 */ + /** + * @desc 跳转方式 + */ openType: | "navigate" | "redirect" | "switchTab" | "reLaunch" - | "navigateBack"; - /** 当 open-type 为 navigateBack 时有效，表示回退的层数 */ + | "navigateBack" + | "exit"; + /** + * @desc 回退的层数 + * @desc open-type="navigateBack" 时有效 + * @desc 默认为 1 + */ delta: number; - /** 当target="miniProgram"时有效，要打开的小程序 appId */ - appId: string; - /** 当target="miniProgram"时有效，打开的页面路径，如果为空则打开首页 */ - path: string; - /** 当target="miniProgram"时有效，需要传递给目标应用的数据，目标应用可在 App.onLaunch()，App.onShow() 中获取到这份数据 */ - extraData: Record; - /** 当target="miniProgram"时有效，要打开的小程序版本，有效值 develop（开发版），trial（体验版），release（正式版），仅在当前小程序为开发版或体验版时此参数有效；如果当前小程序是体验版或正式版，则打开的小程序必定是正式版 */ - version: string; - /** 当 open-type="navigateTo" 或 open-type="navigateBack" 时有效，窗口的显示/关闭的动画类型。 */ + /** + * @desc 窗口的显示/关闭的动画类型 + * @desc open-type="navigateTo" 或 open-type="navigateBack" 时有效 + * @desc 默认为 pop-in 显示、pop-out 关闭 + */ animationType: - | "auto" - | "none" | "slide-in-right" - | "slide-in-left" - | "slide-in-top" - | "slide-in-bottom" - | "fade-in" - | "zoom-out" - | "zoom-fade-out" - | "pop-in" | "slide-out-right" + | "slide-in-left" | "slide-out-left" + | "slide-in-top" | "slide-out-top" + | "slide-in-bottom" | "slide-out-bottom" + | "pop-in" + | "pop-out" + | "fade-in" | "fade-out" | "zoom-in" + | "zoom-out" | "zoom-fade-in" - | "pop-out"; - /** 当 open-type="navigateTo" 或 open-type="navigateBack" 时有效，窗口的显示/关闭动画的持续时间。 */ + | "zoom-fade-out" + | "none"; + /** + * @desc 窗口的显示/关闭动画的持续时间 + * @desc open-type="navigateTo" 或 open-type="navigateBack" 时有效 + * @desc 默认为 300 + */ animationDuration: number; - /** 指定按下去的样式类。当 hover-class="none" 时，没有点击态效果 */ + /** + * @desc 指定点击时的样式类 + * @desc hover-class="none" 时，没有点击态效果 + * @desc 默认为 navigator-hover + */ hoverClass: string; - /** 指定是否阻止本节点的祖先节点出现点击态 */ + /** + * @desc 指定是否阻止本节点的祖先节点出现点击态 + * @desc 默认为 false + */ hoverStopPropagation: boolean; - /** 按住后多久出现点击态，单位为 ms */ + /** + * @desc 按住后多久出现点击态 + * @desc 单位为 ms + * @desc 默认为 50 + */ hoverStartTime: number; - /** 手指松开后点击态保留时间，单位为 ms */ + /** + * @desc 手指松开后点击态保留时间 + * @desc 单位为 ms + * @desc 默认为 600 + */ hoverStayTime: number; + /** + * @desc 在哪个目标上发生跳转 + * @desc 默认为 self + */ + target: "self" | "miniProgram"; + /** + * @desc 要打开的小程序 appId + * @desc target="miniProgram" 时有效 + */ + appId: string; + /** + * @desc 打开的页面路径，如果为空则打开首页 + * @desc target="miniProgram" 时有效 + */ + path: string; + /** + * @desc 需要传递给目标应用的数据 + * @desc target="miniProgram" 时有效 + */ + extraData: Record; + /** + * @desc 要打开的小程序版本 + * @desc 如果当前小程序是正式版，则打开的小程序必定是正式版 + * @desc target="miniProgram" 时有效 + * @desc 默认为 release + */ + version: "develop" | "trial" | "release"; + /** + * @desc 当传递该参数后，可以不传 app-id 和 path + * @desc target="miniProgram" 时有效 + */ + shortLink: string; }, {} >; From fc25e4a90493fe6749b760dff225adf4bbe64824 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 14:41:37 +0800 Subject: [PATCH 44/59] feat: update audio types --- index.d.ts | 80 ++++++++++++++++++++++++++++++++++++++++++++++++------ 1 file changed, 71 insertions(+), 9 deletions(-) diff --git a/index.d.ts b/index.d.ts index d1f514d..8486bf2 100644 --- a/index.d.ts +++ b/index.d.ts @@ -2317,21 +2317,83 @@ type TNavigator = TComponent< {} >; -/** 音频 */ +/** + * @desc audio error 事件对象 + */ +type TAudioErrorEvent = TEvent & { + detail: { + errMsg: number; + }; +}; +/** + * @desc audio timeupdate 事件对象 + */ +type TAudioTimeupdateEvent = TEvent & { + detail: { + currentTime: number; + duration: number; + }; +}; +/** + * @desc 音频 + */ type TAudio = TComponent< { - /** 是否循环播放 */ + /** + * @desc audio 组件的唯一标识符 + */ + id: string; + /** + * @desc 要播放音频的资源地址 + */ + src: string; + /** + * @desc 是否循环播放 + * @desc 默认为 false + */ loop: boolean; - /** webview 指向网页的链接 */ - src: string | string; - /** 控件 */ - controls: any[]; - /** 视频封面的图片网络资源地址，如果 controls 属性值为 false 则设置 poster 无效 */ + /** + * @desc 是否显示默认控件 + * @desc 默认为 false + */ + controls: boolean; + /** + * @desc 默认控件上的音频封面的图片资源地址 + * @desc 如果 controls 值为 false 则无效 + */ poster: string; - /** 默认控件上的音频名字，如果 controls 属性值为 false 则设置 name 无效 */ + /** + * @desc 默认控件上的音频名字 + * @desc 如果 controls 值为 false 则无效 + * @desc 默认为“未知音频” + */ name: string; - /** 默认控件上的作者名字，如果 controls 属性值为 false 则设置 author 无效 */ + /** + * @desc 默认控件上的作者名字 + * @desc 如果 controls 值为 false 则无效 + * @desc 默认为“未知作者” + */ author: string; + /** + * @desc 发生错误时触发 + */ + onError: (event: TAudioErrorEvent) => void; + /** + * @desc 开始/继续播放时触发 + */ + onPlay: (event: TEvent) => void; + /** + * @desc 暂停播放时触发 + */ + onPause: (event: TEvent) => void; + /** + * @desc 播放进度改变时触发 + */ + onTimeupdate: (event: TAudioTimeupdateEvent) => void; + /** + * @desc 播放到末尾时触发 + */ + onEnded: (event: TEvent) => void; }, {} >; From 14ec048262ca1df3c5c1f3c1aba08b98e052928c Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 14:48:49 +0800 Subject: [PATCH 45/59] feat: update camera types --- index.d.ts | 70 +++++++++++++++++++++++++++++++++++++++++++++--------- 1 file changed, 59 insertions(+), 11 deletions(-) diff --git a/index.d.ts b/index.d.ts index 8486bf2..d29e417 100644 --- a/index.d.ts +++ b/index.d.ts @@ -2398,6 +2398,65 @@ type TAudio = TComponent< {} >; +/** + * @desc camera initdone 事件对象 + */ +type TCameraInitdoneEvent = TEvent & { + detail: { + maxZoom: number; + }; +}; +/** + * @desc 页面内嵌的区域相机组件 + */ +type TCamera = TComponent< + { + /** + * @desc 应用模式，不支持动态修改 + * @desc 默认为 normal + */ + mode: "normal" | "scanCode"; + /** + * @desc 分辨率，不支持动态修改 + * @desc 默认为 medium + */ + resolution: "low" | "medium" | "high"; + /** + * @desc 摄像头朝向 + * @desc 默认为 back + */ + devicePosition: "front" | "back"; + /** + * @desc 闪光灯 + * @desc 默认为 auto + */ + flash: "auto" | "on" | "off" | "torch"; + /** + * @desc 期望的相机帧数据尺寸 + * @desc 默认为 medium + */ + frameSize: "small" | "medium" | "large"; + /** + * @desc 摄像头在非正常终止时触发 + */ + onStop: (event: TEvent) => void; + /** + * @desc 用户不允许使用摄像头时触发 + */ + onError: (event: TEvent) => void; + /** + * @desc 相机初始化完成时触发 + */ + onInitdone: (event: TCameraInitdoneEvent) => void; + /** + * @desc 扫码识别成功时触发 + * @desc mode="scanCode" 时生效 + */ + onScancode: (event: TEvent) => void; + }, + {} +>; + /** 图片 */ type TImage = TComponent< { @@ -2553,17 +2612,6 @@ type TWebView = TComponent< {} >; -/** 相机组件 */ -type TCamera = TComponent< - { - /** 前置或后置，值为front, back */ - flash: "back" | "front"; - /** 闪光灯，值为auto, on, off */ - devicePosition: string; - }, - {} ->; - /** 实时音视频播放 */ type TLivePlayer = TComponent< { From 7fea8361f188493444247f50ece18ed5e94d05ef Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 15:17:54 +0800 Subject: [PATCH 46/59] feat: update image types --- index.d.ts | 58 ++++++++++++++++++++++++++++++++++++++++++++---------- 1 file changed, 48 insertions(+), 10 deletions(-) diff --git a/index.d.ts b/index.d.ts index d29e417..b9c57a1 100644 --- a/index.d.ts +++ b/index.d.ts @@ -2457,14 +2457,26 @@ type TCamera = TComponent< {} >; -/** 图片 */ +/** + * @desc image load 事件对象 + */ +type TImageLoadEvent = TEvent & { + height: string; + width: string; +}; +/** + * @desc 图片 + */ type TImage = TComponent< { - /** 是否循环播放 */ - loop: boolean; - /** webview 指向网页的链接 */ - src: string | string; - /** 图片裁剪、缩放的模式 */ + /** + * @desc 图片资源地址 + */ + src: string; + /** + * @desc 图片裁剪、缩放的模式 + * @desc 默认为 scaleToFill + */ mode: | "scaleToFill" | "aspectFit" @@ -2480,14 +2492,40 @@ type TImage = TComponent< | "top right" | "bottom left" | "bottom right"; - /** 图片懒加载。只针对page与scroll-view下的image有效 */ + /** + * @desc 是否开启图片懒加载 + * @desc 只对 page 与 scroll-view 下的 image 有效 + * @desc 默认为 false + */ lazyLoad: boolean; - /** 图片显示动画效果 */ + /** + * @desc 是否使用图片显示动画效果 + * @desc 默认为 true + */ fadeShow: boolean; - /** 默认不解析 webP 格式，只支持网络资源 */ + /** + * @desc 在系统不支持 webp 的情况下是否单独启用 webp + * @desc 默认为 false + */ webp: boolean; - /** 开启长按图片显示识别小程序码菜单 */ + /** + * @desc 是否开启长按图片显示识别小程序码菜单 + * @desc 默认为 false + */ showMenuByLongpress: boolean; + /** + * @desc 是否能拖动图片 + * @desc 默认为 true + */ + draggable: boolean; + /** + * @desc 图片加载错误时触发 + */ + onError: (event: TEvent) => void; + /** + * @desc 图片加载完毕时触发 + */ + onLoad: (event: TImageLoadEvent) => void; }, {} >; From b3850b05d801358b8dc7de39dc5eec2a8bb83a64 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 15:18:09 +0800 Subject: [PATCH 47/59] feat: update video types --- index.d.ts | 306 +++++++++++++++++++++++++++++++++++++++++++++-------- 1 file changed, 264 insertions(+), 42 deletions(-) diff --git a/index.d.ts b/index.d.ts index b9c57a1..bbc8c53 100644 --- a/index.d.ts +++ b/index.d.ts @@ -2530,73 +2530,295 @@ type TImage = TComponent< {} >; -/** 视频 */ +/** + * @desc video timeupdate 事件对象 + */ +type TVideoTimeupdateEvent = TEvent & { + detail: { + currentTime: number; + duration: number; + }; +}; +/** + * @desc video fullscreenchange 事件对象 + */ +type TVideoFullscreenchangeEvent = TEvent & { + detail: { + fullScreen: boolean; + direction: "vertical" | "horizontal"; + }; +}; +/** + * @desc video progress 事件对象 + */ +type TVideoProgressEvent = TEvent & { + detail: { + buffered: number; + }; +}; +/** + * @desc video loadedmetadata 事件对象 + */ +type TVideoLoadedmetadataEvent = TEvent & { + detail: { + width: number; + height: number; + duration: number; + }; +}; +/** + * @desc video fullscreenclick 事件对象 + */ +type TVideoFullscreenclickEvent = TEvent & { + detail: { + screenX: number; + screenY: number; + screenWidth: number; + screenHeight: number; + }; +}; +/** + * @desc video controlstoggle 事件对象 + */ +type TVideoControlstoggleEvent = TEvent & { + detail: { + show: boolean; + }; +}; +/** + * @desc 视频播放组件 + */ type TVideo = TComponent< { - /** 是否循环播放 */ + /** + * @desc 要播放视频的资源地址 + */ + src: string; + /** + * @desc 是否自动播放 + * @desc 默认为 false + */ + autoplay: boolean; + /** + * @desc 是否循环播放 + * @desc 默认为 false + */ loop: boolean; - /** webview 指向网页的链接 */ - src: string | string; - /** 指定视频初始播放位置 */ + /** + * @desc 是否静音播放 + * @desc 默认为 false + */ + muted: boolean; + /** + * @desc 指定视频初始播放位置 + * @desc 单位为 s + */ initialTime: number; - /** 指定视频长度 */ + /** + * @desc 指定视频长度 + * @desc 单位为 s + */ duration: number; - /** 控件 */ - controls: any[]; - /** 弹幕列表 */ - danmuList: any[]; - /** 是否显示弹幕按钮，只在初始化时有效，不能动态变更 */ + /** + * @desc 是否显示默认播放控件（播放/暂停按钮、播放进度、时间） + * @desc 默认为 true + */ + controls: boolean; + /** + * @desc 弹幕列表 + */ + danmuList: { text: string; color: string; time: number }[]; + /** + * @desc 是否显示弹幕按钮，不支持动态修改 + * @desc 默认为 false + */ danmuBtn: boolean; - /** 是否展示弹幕，只在初始化时有效，不能动态变更 */ + /** + * @desc 是否展示弹幕，不支持动态修改 + * @desc 默认为 false + */ enableDanmu: boolean; - /** 自动播放 */ - autoplay: boolean; - /** 是否静音 */ - muted: boolean; - /** 在非全屏模式下，是否开启亮度与音量调节手势 */ + /** + * @desc 在非全屏模式下，是否开启亮度与音量调节手势 + * @desc 默认为 false + */ pageGesture: boolean; - /** movable-view 的移动方向。 */ - direction: "all" | "vertical" | "horizontal" | "none"; - /** 若不设置，宽度大于240时才会显示 */ + /** + * @desc 设置全屏时视频的方向，不指定则根据宽高比自动判断 + */ + direction: 0 | 90 | -90; + /** + * @desc 若不设置，宽度大于 240 时才会显示 + * @desc 默认为 true + */ showProgress: boolean; - /** 是否显示全屏按钮 */ + /** + * @desc 是否显示全屏按钮 + * @desc 默认为 true + */ showFullscreenBtn: boolean; - /** 是否显示视频底部控制栏的播放按钮 */ + /** + * @desc 是否显示视频底部控制栏的播放按钮 + * @desc 默认为 true + */ showPlayBtn: boolean; - /** 是否显示视频中间的播放按钮 */ + /** + * @desc 是否显示视频中间的播放按钮 + * @desc 默认为 true + */ showCenterPlayBtn: boolean; - /** 是否开启控制进度的手势 */ + /** + * @desc 是否显示 loading 控件 + * @desc 默认为 true + */ + showLoading: boolean; + /** + * @desc 是否开启控制进度的手势 + * @desc 默认为 true + */ enableProgressGesture: boolean; - /** 当视频大小与 video 容器大小不一致时，视频的表现形式。 */ + /** + * @desc 当视频大小与 video 容器大小不一致时，视频的表现形式 + */ objectFit: "contain" | "fill" | "cover"; - /** 视频封面的图片网络资源地址，如果 controls 属性值为 false 则设置 poster 无效 */ + /** + * @desc 视频封面的图片网络资源地址 + * @desc 如果 controls 值为 false 则无效 + */ poster: string; - /** 是否显示静音按钮 */ + /** + * @desc 是否显示静音按钮 + * @decs 默认为 false + */ showMuteBtn: boolean; - /** 视频的标题，全屏时在顶部展示 */ + /** + * @desc 视频的标题，全屏时在顶部展示 + */ title: string; - /** 播放按钮的位置 */ - playBtnPosition: string; - /** 是否开启播放手势，即双击切换播放、暂停 */ + /** + * @desc 播放按钮的位置 + * @desc 默认为 bottom + */ + playBtnPosition: "bottom" | "center"; + /** + * @desc 移动网络提醒样式 + * @desc 默认为 1 + */ + mobilenetHintType: 0 | 1; + /** + * @desc 是否开启播放手势，即双击切换播放、暂停 + * @desc 默认为 false + */ enablePlayGesture: boolean; - /** 当跳转到其它小程序页面时，是否自动暂停本页面的视频 */ + /** + * @desc 当跳转到其它小程序页面时，是否自动暂停本页面的视频 + * @desc 默认为 true + */ autoPauseIfNavigate: boolean; - /** 当跳转到其它微信原生页面时，是否自动暂停本页面的视频 */ + /** + * @desc 当跳转到其它微信原生页面时，是否自动暂停本页面的视频 + * @desc 默认为 true + */ autoPauseIfOpenNative: boolean; - /** 在非全屏模式下，是否开启亮度与音量调节手势（同 page-gesture） */ + /** + * @desc 在非全屏模式下，是否开启亮度与音量调节手势（同 page-gesture） + * @desc 默认为 false + */ vslideGesture: boolean; - /** 在全屏模式下，是否开启亮度与音量调节手势 */ + /** + * @desc 在全屏模式下，是否开启亮度与音量调节手势 + * @desc 默认为 true + */ vslideGestureInFullscreen: boolean; - /** 视频前贴广告单元ID */ + /** + * @desc 视频前贴广告单元ID + */ adUnitId: string; - /** 用于给搜索等场景作为视频封面展示，建议使用无播放 icon 的视频封面图，只支持网络地址 */ + /** + * @desc 用于给搜索等场景作为视频封面展示 + * @desc 建议使用无播放 icon 的视频封面图 + * @desc 只支持网络地址 + */ posterForCrawler: string; - /** 解码器选择 */ - codec: string; - /** 是否对 http、https 视频源开启本地缓存 */ + /** + * @desc 解码器选择 + * @desc 默认为 hardware + */ + codec: "hardware" | "software"; + /** + * @desc 是否对 http、https 视频源开启本地缓存 + * @desc 默认为 true + */ httpCache: boolean; - /** 播放策略 */ - playStrategy: number; + /** + * @desc 播放策略 + * @desc 默认为 0 + */ + playStrategy: 0 | 1 | 2; + /** + * @desc HTTP 请求 Header + */ + header: Record; + /** + * @desc 开始/继续播放时触发 + */ + onPlay: (event: TEvent) => void; + /** + * @desc 暂停播放时触发 + */ + onPause: (event: TEvent) => void; + /** + * @desc 播放到末尾时触发 + */ + onEnded: (event: TEvent) => void; + /** + * @desc 播放进度变化时触发 + */ + onTimeupdate: (event: TVideoTimeupdateEvent) => void; + /** + * @desc 视频进入和退出全屏时触发 + */ + onFullscreenchange: (event: TVideoFullscreenchangeEvent) => void; + /** + * @desc 视频缓冲时触发 + */ + onWaiting: (event: TEvent) => void; + /** + * @desc 视频播放出错时触发 + */ + onError: (event: TEvent) => void; + /** + * @desc 加载进度变化时触发 + */ + onProgress: (event: TVideoProgressEvent) => void; + /** + * @desc 视频资源开始加载时触发 + */ + onLoadeddata: (event: TEvent) => void; + /** + * @desc 开始加载数据时触发 + */ + onLoadstart: (event: TEvent) => void; + /** + * @desc 拖动进度条结束时触发 + */ + onSeeked: (event: TEvent) => void; + /** + * @desc 拖动进度条时触发 + */ + onSeeking: (event: TEvent) => void; + /** + * @desc 视频元数据加载完成时触发 + */ + onLoadedmetadata: (event: TVideoLoadedmetadataEvent) => void; + /** + * @desc 视频播放全屏播放点击时触发 + */ + onFullscreenclick: (event: TVideoFullscreenclickEvent) => void; + /** + * @desc 切换 controls 显示隐藏时触发 + */ + onControlstoggle: (event: TVideoControlstoggleEvent) => void; }, {} >; From 447ebe8e215d9b536dac4fd8d40cad5d433b0ff0 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 15:18:19 +0800 Subject: [PATCH 48/59] fix: fix text --- index.d.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/index.d.ts b/index.d.ts index bbc8c53..3d67301 100644 --- a/index.d.ts +++ b/index.d.ts @@ -459,7 +459,7 @@ type TSwiper = TComponent< disableTouch: boolean; /** * @desc 是否监听用户的触摸事件 - * @desc 只在初始化时有效，不能动态变更 + * @desc 只在初始化时有效，不支持动态修改 * @desc 默认为 true */ touchable: boolean; @@ -819,7 +819,7 @@ type TRichText = TComponent< selectable: boolean; /** * @desc 是否阻止长按图片时弹起默认菜单 - * @desc 只在初始化时有效，不能动态变更 + * @desc 只在初始化时有效，不支持动态修改 * @desc 默认为 false */ imageMenuPrevent: boolean; From 4e8983665844a4f4d25f4e5fccd2ccac8a8ca2ee Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 15:56:17 +0800 Subject: [PATCH 49/59] feat: update live-player and live-pusher types --- index.d.ts | 409 +++++++++++++++++++++++++++++++++++++++++++++-------- 1 file changed, 349 insertions(+), 60 deletions(-) diff --git a/index.d.ts b/index.d.ts index 3d67301..0e7d37f 100644 --- a/index.d.ts +++ b/index.d.ts @@ -2823,6 +2823,355 @@ type TVideo = TComponent< {} >; +/** + * @desc live-player statechage 事件对象 + */ +type TLivePlayerStatechangeEvent = TEvent & { + detail: { + code: number; + }; +}; +/** + * @desc live-player netstatus 事件对象 + */ +type TLivePlayerNetstatusEvent = TEvent & { + detail: { + info: { + videoBitrate: number; + audioBitrate: number; + videoFPS: number; + videoGOP: number; + netSpeed: number; + netJitter: number; + netQualityLevel: number; + videoWidth: number; + videoHeight: number; + videoCache: number; + audioCache: number; + vDecCacheSize: number; + vSumCacheSize: number; + avPlayInterval: number; + avRecvInterval: number; + audioCacheThreshold: number; + }; + }; +}; +/** + * @desc live-player fullscreenchagne 事件对象 + */ +type TLivePlayerFullscreenchangeEvent = TEvent & { + detail: { + direction: "vertical" | "horizontal"; + fullScreen: boolean; + }; +}; +/** + * @desc 实时音视频播放（直播拉流） + */ +type TLivePlayer = TComponent< + { + /** + * @desc 唯一标志符 + */ + id: string; + /** + * @desc 音视频地址 + */ + src: string; + /** + * @desc 实时模式 + * @desc 默认为 live + */ + mode: "live" | "RTC"; + /** + * @desc 是否自动播放 + * @desc 默认为 false + */ + autoplay: boolean; + /** + * @desc 是否静音 + * @desc 默认为 false + */ + muted: boolean; + /** + * @desc 画面方向 + * @desc 默认为 vertical + */ + orientation: "vertical" | "horizontal"; + /** + * @desc 填充模式 + * @desc 默认为 contain + */ + objectFit: "contain" | "fillCrop"; + /** + * @desc 进入后台时是否静音 + * @desc 默认为 false + */ + backgroundMute: boolean; + /** + * @desc 声音输出方式 + * @desc 默认为 speaker + */ + soundMode: "speaker" | "ear"; + /** + * @desc 最小缓冲区 + * @desc 单位为 s + * @desc 默认为 1 + */ + minCache: string; + /** + * @desc 最大缓冲区 + * @desc 单位为 s + * @desc 默认为 3 + */ + maxCache: string; + /** + * @desc 设置小窗模式，空字符串或通过数组形式设置多种模式 + */ + pictureInPictureMode: + | "push" + | "pop" + | [] + | ["push", "pop"] + | ["pop", "push"] + | ["push"] + | ["pop"]; + /** + * @desc 播放状态变化时触发 + */ + onStatechange: (event: TLivePlayerStatechangeEvent) => void; + /** + * @desc 网络状态变化时触发 + */ + onNetstatus: (event: TLivePlayerNetstatusEvent) => void; + /** + * @desc 全屏变化时触发 + */ + onFullscreenchange: (event: TLivePlayerFullscreenchangeEvent) => void; + /** + * @desc 播放音量变化时触发 + */ + onAudiovolumenotify: (event: TEvent) => void; + /** + * @desc 播放器进入小窗时触发 + */ + onEnterpictureinpicture: (event: TEvent) => void; + /** + * @desc 播放器退出小窗时触发 + */ + onLeavepictureinpicture: (event: TEvent) => void; + }, + {} +>; + +/** + * @desc live-pusher statechage 事件对象 + */ +type TLivePusherStatechangeEvent = TEvent & { + detail: { + code: number; + }; +}; +/** + * @desc live-pusher netstatus 事件对象 + */ +type TLivePusherNetstatusEvent = TEvent & { + detail: { + info: { + videoBitrate: number; + audioBitrate: number; + videoFPS: number; + videoGOP: number; + netSpeed: number; + netJitter: number; + netQualityLevel: number; + videoWidth: number; + videoHeight: number; + videoCache: number; + audioCache: number; + vDecCacheSize: number; + vSumCacheSize: number; + avPlayInterval: number; + avRecvInterval: number; + audioCacheThreshold: number; + }; + }; +}; +/** + * @desc live-pusher error 事件对象 + */ +type TLivePushErrorEvent = TEvent & { + detail: { + errMsg: string; + errCode: number; + }; +}; +/** + * @desc live-pusher bgmprogress 事件对象 + */ +type TLivePushBgmprogressEvent = TEvent & { + detail: { + direction: "vertical" | "horizontal"; + fullScreen: boolean; + }; +}; +/** + * @desc 实时音视频录制（直播推流） + */ +type TLivePusher = TComponent< + { + /** + * @desc 推流地址，支持 RTMP 协议 + */ + url: string; + /** + * @desc 推流视频模式 + * @desc 默认为 SD + */ + mode: "SD" | "HD" | "FHD"; + /** + * @desc 是否自动推流 + * @desc 默认为 false + */ + autopush: boolean; + /** + * @desc 视频宽高比例 + * @desc 默认为 3:2 + */ + aspect: number; + /** + * @desc 是否静音 + * @desc 默认为 false + */ + muted: boolean; + /** + * @desc 是否开启摄像头 + * @desc 默认为 true + */ + enableCamera: boolean; + /** + * @desc 自动聚焦 + * @desc 默认为 true + */ + autoFocus: boolean; + /** + * @desc 美颜 + * @desc 取值范围为 0 - 9 + * @desc 默认为 0 + */ + beauty: number; + /** + * @desc 美白 + * @desc 取值范围为 0 - 9 + * @desc 默认为 0 + */ + whiteness: number; + /** + * @desc 画面方向 + * @desc 默认为 vertical + */ + orientation: "vertical" | "horizontal"; + /** + * @desc 最小码率 + * @desc 默认为 200 + */ + minBitrate: number; + /** + * @desc 最大码率 + * @desc 默认为 1000 + */ + maxBitrate: number; + /** + * @desc 音质 + * @desc 默认为 high + */ + audioQuality: "high" | "low"; + /** + * @desc 进入后台时推流的等待画面 + */ + waitingImage: string; + /** + * @desc 等待画面资源的 MD5 值 + */ + waitingImageMd5: string; + /** + * @desc 是否调整焦距 + * @desc 默认为 false + */ + zoom: boolean; + /** + * @desc 摄像头朝向 + * @desc 默认为 front + */ + devicePosition: "front" | "back"; + /** + * @desc 进入后台时是否静音 + * @desc 默认为 false + */ + backgroundMute: boolean; + /** + * @desc 设置推流画面是否镜像，产生的效果在 live-player 呈现 + * @desc 默认为 false + */ + remoteMirror: boolean; + /** + * @desc 控制本地预览画面是否镜像 + * @desc 默认为 auto + */ + localMirror: "auto" | "enable" | "disable"; + /** + * @desc 音频混响类型 + * @desc 默认为 0 + */ + audioReverbType: 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7; + /** + * @desc 是否开启麦克风 + * @desc 默认为 true + */ + enableMic: boolean; + /** + * @desc 是否开启音频自动增益 + * @desc 默认为 false + */ + enableAgc: boolean; + /** + * @desc 是否开启音频噪声抑制 + * @desc 默认为 false + */ + enableAns: boolean; + /** + * @desc 音量类型 + * @desc 默认为 auto + */ + audioVolumeType: "auto" | "media" | "voicecall"; + /** + * @desc 播放状态变化时触发 + */ + onStatechange: (event: TLivePusherStatechangeEvent) => void; + /** + * @desc 网络状态变化时触发 + */ + onNetstatus: (event: TLivePusherNetstatusEvent) => void; + /** + * @desc 渲染错误时触发 + */ + onError: (event: TLivePushErrorEvent) => void; + /** + * @desc 背景音开始播放时触发 + */ + onBgmstart: (event: TEvent) => void; + /** + * @desc 背景音进度变化时触发 + */ + onBgmprogress: (event: TLivePushBgmprogressEvent) => void; + /** + * @desc 背景音播放完成时触发 + */ + onBgmcomplete: (event: TEvent) => void; + }, + {} +>; + /** 地图 */ type TMap = TComponent< { @@ -2872,66 +3221,6 @@ type TWebView = TComponent< {} >; -/** 实时音视频播放 */ -type TLivePlayer = TComponent< - { - /** webview 指向网页的链接 */ - src: string | string; - /** live（直播），RTC（实时通话，该模式时延更低） */ - mode: "live" | "RTC"; - /** 自动播放 */ - autoplay: boolean; - /** 是否静音 */ - muted: boolean; - /** 画面方向，可选值有 vertical，horizontal */ - orientation: "vertical" | "horizontal"; - /** 填充模式，可选值有 contain，fillCrop */ - objectFit: "contain" | "fillCrop"; - /** 进入后台时是否静音 */ - backgroundMute: boolean; - /** 最小缓冲区，单位s */ - minCache: string; - /** 最大缓冲区，单位s */ - maxCache: string; - }, - {} ->; - -/** 实时音视频录制 */ -type TLivePusher = TComponent< - { - /** 推流地址。目前仅支持 flv, rtmp 格式 */ - url: string; - /** 推流视频模式，可取值：SD（标清）, HD（高清）, FHD（超清）。 */ - mode: "SD" | "HD" | "FHD"; - /** 自动推流 */ - autopush: boolean; - /** 是否静音 */ - muted: boolean; - /** 开启摄像头 */ - enableCamera: boolean; - /** 获取焦点 */ - autoFocus: boolean; - /** 画面方向，可选值有 vertical，horizontal */ - orientation: "vertical" | "horizontal"; - /** 美颜 */ - beauty: number; - /** 美白 */ - aspect: number; - /** 最小码率 */ - minBitrate: string; - /** 最大码率 */ - maxBitrate: string; - /** 进入后台时推流的等待画面 */ - waitingImage: string; - /** 等待画面资源的MD5值 */ - waitingImageMd5: string; - /** 进入后台时是否静音 */ - backgroundMute: boolean; - }, - {} ->; - /** 用于展示微信开放的数据 */ type TOpenData = TComponent< { From 13bde570c7ffc22449104f845d04e80c82e65213 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 16:34:16 +0800 Subject: [PATCH 50/59] feat: update map types --- index.d.ts | 301 +++++++++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 283 insertions(+), 18 deletions(-) diff --git a/index.d.ts b/index.d.ts index 0e7d37f..203128f 100644 --- a/index.d.ts +++ b/index.d.ts @@ -3172,29 +3172,294 @@ type TLivePusher = TComponent< {} >; -/** 地图 */ +/** + * @desc map markertap 事件对象 + */ +type TMapMarkertapEvent = TEvent & { + detail: { + markerId: number; + }; +}; +/** + * @desc map labeltap 事件对象 + */ +type TMapLabeltapEvent = TEvent & { + detail: { + markerId: number; + }; +}; +/** + * @desc map callouttap 事件对象 + */ +type TMapCallouttapEvent = TEvent & { + detail: { + markerId: number; + }; +}; +/** + * @desc map controltap 事件对象 + */ +type TMapControltapEvent = TEvent & { + detail: { + controlId: number; + }; +}; +/** + * @desc map anchorpointtap 事件对象 + */ +type TMapAnchorpointtapEvent = TEvent & { + detail: { + longitude: number; + latitude: number; + }; +}; +/** + * @desc map poitap 事件对象 + */ +type TMapPoitapEvent = TEvent & { + detail: { + name: string; + longitude: number; + latitude: number; + }; +}; +/** + * @desc 地图组件，用于展示地图 + */ type TMap = TComponent< { - /** 中心经度 */ + /** + * @desc 中心经度 + */ longitude: number; - /** 中心纬度 */ + /** + * @desc 中心纬度 + */ latitude: number; - /** 是否支持双指缩放，默认缩放手势生效区域是在 movable-view 内。 */ - scale: boolean; - /** 标记点 */ - markers: any[]; - /** 即将移除，请使用 markers */ - covers: any[]; - /** 路线 */ - polyline: any[]; - /** 圆 */ - circles: any[]; - /** 控件 */ - controls: any[]; - /** 缩放视野以包含所有给定的坐标点 */ - includePoints: any[]; - /** 显示带有方向的当前定位点 */ + /** + * @desc 缩放级别 + * @desc 取值范围为 3 - 20 + * @desc 默认为 16 + */ + scale: number; + /** + * @desc 主题，仅 Android 支持，不支持动态修改 + * @desc 默认为 normal + */ + theme: "normal" | "satellite"; + /** + * @desc 最小缩放级别 + * @desc 默认为 3 + */ + minScale: number; + /** + * @desc 最大缩放级别 + * @desc 默认为 20 + */ + maxScale: number; + /** + * @desc 个性化地图配置的 style，不支持动态修改 + * @desc 默认为 1 + */ + layerStyle: number | string; + /** + * @desc 标记点 + */ + markers: { + id: number; + latitude: number; + longitude: number; + title: string; + iconPath: string; + rotate: number; + alpha: number; + width: number; + height: number; + callout: { + content: string; + color: string; + fontSize: number; + borderRadius: number; + borderWidth: number; + borderColor: string; + bgColor: string; + padding: number; + display: "BYCLICK" | "ALWAYS"; + textAlign: "left" | "right" | "center"; + }; + label: { + content: string; + color: string; + fontSize: number; + x: number; + y: number; + anchorX: number; + anchorY: number; + borderWidth: number; + borderColor: string; + borderRadius: number; + bgColor: string; + padding: number; + textAlign: "left" | "right" | "center"; + customCallout: { + display: "BYLCICK" | "ALWAYS"; + }; + ariaLabel: string; + joinCluster: boolean; + }; + }[]; + /** + * @desc 路线，指定一系列坐标点，从数组第一项连线至最后一项 + */ + polyline: { + points: { latitude: number; longitude: number }[]; + color: string; + width: number; + dottedLie: boolean; + arrowLine: boolean; + arrowIconPath: string; + borderColor: string; + borderWidth: number; + colorList: string[]; + level: "abovelabels" | "abovebuildings" | "aboveroads"; + }[]; + /** + * @desc 圆，在地图上显示圆 + */ + circles: { + latitude: number; + longitude: number; + color: string; + fillColor: string; + radius: number; + strokeWidth: number; + level: "abovelabels" | "abovebuildings" | "aboveroads"; + }[]; + /** + * @desc 控件，不随着地图移动 + */ + controls: { + id: number; + position: { + left: number; + top: number; + width: number; + height: number; + }; + iconPath: string; + clickable: boolean; + }[]; + /** + * @desc 缩放视野以包含所有给定的坐标点 + */ + includePoints: { latitude: number; longitude: number }[]; + /** + * @desc 是否显示 3D 楼块 + * @desc 默认为 false + */ + enable3D: boolean; + /** + * @desc 是否显示指南针 + * @desc 默认为 false + */ + showCompass: boolean; + /** + * @desc 是否支持缩放 + * @dsec 默认为 true + */ + enableZoom: boolean; + /** + * @desc 是否支持拖动 + * @desc 默认为 true + */ + enableScroll: boolean; + /** + * @desc 是否支持旋转 + * @desc 默认为 false + */ + enableRotate: boolean; + /** + * @desc 是否开启俯视 + * @desc 默认为 false + */ + enableOverlooking: boolean; + /** + * @desc 是否开启卫星图 + * @desc 默认为 false + */ + enableSatellite: boolean; + /** + * @desc 是否开启实时路况 + * @desc 默认为 false + */ + enableTraffice: boolean; + /** + * @desc 是否展示 POI 点 + * @desc 默认为 false + */ + enablePoi: boolean; + /** + * @desc 是否展示建筑物 + * @desc 默认为 false + */ + enableBuilding: false; + /** + * @desc 是否显示带有方向的当前定位点 + * @desc 默认为 false + */ showLocation: boolean; + /** + * @desc 多边形，指定一系列坐标点，生成闭合多边形 + */ + polygons: { + points: { latitude: number; longitude: number }[]; + strokeWidth: number; + strokeColor: string; + fillColor: string; + zIndex: number; + level: "abovelabels" | "abovebuildings" | "aboveroads"; + }[]; + /** + * @desc 是否展示室内地图 + * @desc 默认为 false + */ + enableIndoorMap: boolean; + /** + * @desc 点击标记点时触发 + */ + onMarkertap: (event: TMapMarkertapEvent) => void; + /** + * @desc 点击 label 时触发 + */ + onLabeltap: (event: TMapLabeltapEvent) => void; + /** + * @desc 点击标记点对应的气泡时触发 + */ + onCallouttap: (event: TMapCallouttapEvent) => void; + /** + * @desc 点击控件时触发 + */ + onControltap: (event: TMapControltapEvent) => void; + /** + * @desc 视野发生变化时触发 + */ + onRegionchange: (event: TEvent) => void; + /** + * @desc 点击地图时触发 + */ + onTap: (event: TEvent) => void; + /** + * @desc 地图渲染更新完成时触发 + */ + onUpdated: (event: TEvent) => void; + /** + * @desc 点击定位标时触发 + */ + onAnchorpointtap: (event: TMapAnchorpointtapEvent) => void; + /** + * @desc 点击地图 poi 点时触发 + */ + onPoitap: (event: TMapPoitapEvent) => void; }, {} >; From 2f5e9560d14e47088903a874ba55d93f4af186f2 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 16:51:36 +0800 Subject: [PATCH 51/59] feat: update canvas types --- index.d.ts | 54 +++++++++++++++++++++++++++++++++++++++++++++++++++--- 1 file changed, 51 insertions(+), 3 deletions(-) diff --git a/index.d.ts b/index.d.ts index 203128f..d842c0a 100644 --- a/index.d.ts +++ b/index.d.ts @@ -3464,13 +3464,61 @@ type TMap = TComponent< {} >; -/** 画布 */ +/** + * @desc canvas error 事件对象 + */ +type TCanvasErrorEvent = TEvent & { + detail: { + errMsg: string; + }; +}; +/** + * @desc 画布 + */ type TCanvas = TComponent< { - /** canvas 组件的唯一标识符 */ + /** + * @desc canvas 类型 + */ + type: "2d" | "webgl"; + /** + * @desc 唯一标识符 + */ canvasId: string; - /** 当在 canvas 中移动时且有绑定手势事件时，禁止屏幕滚动以及下拉刷新 */ + /** + * @desc 当在 canvas 中移动时且有绑定手势事件时，是否禁止屏幕滚动以及下拉刷新 + * @desc 默认为 false + */ disableScroll: boolean; + /** + * @desc 是否启用高清处理 + * @desc 默认为 true + */ + hidpi: boolean; + /** + * @desc 手指触摸动作开始时触发 + */ + onTouchstart: (event: TEvent) => void; + /** + * @desc 手指触摸后移动时触发 + */ + onTouchmove: (event: TEvent) => void; + /** + * @desc 手指触摸动作结束时触发 + */ + onTouchend: (event: TEvent) => void; + /** + * @desc 手指触摸动作被打断时触发 + */ + onTouchcancel: (event: TEvent) => void; + /** + * @desc 手指长按 500ms 之后触发，触发了长按事件后进行移动不会触发屏幕的滚动 + */ + onLongtap: (event: TEvent) => void; + /** + * @desc 发生错误时触发 + */ + onError: (event: TCanvasErrorEvent) => void; }, {} >; From 5391d77fa83a6f33c048bc7a5bbb60192af65b5c Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 17:00:27 +0800 Subject: [PATCH 52/59] feat: update web-view types --- index.d.ts | 48 ++++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 44 insertions(+), 4 deletions(-) diff --git a/index.d.ts b/index.d.ts index d842c0a..8533d3f 100644 --- a/index.d.ts +++ b/index.d.ts @@ -3523,13 +3523,53 @@ type TCanvas = TComponent< {} >; -/** 承载网页的容器 */ +/** + * @desc web-view message 事件对象 + */ +type TWebViewMessageEvent = TEvent & { + detail: { + data: any[]; + }; +}; +/** + * @desc web 浏览器组件，可承载网页 + */ type TWebView = TComponent< { - /** webview 指向网页的链接 */ + /** + * @desc webview 指向网页的链接 + */ src: string | string; - /** webview 的样式 */ - webviewStyles: Record | boolean; + /** + * @desc 用于为 iframe 指定其特征策略 + */ + allow: string; + /** + * @desc 该属性对呈现在 iframe 框架中的内容启用一些额外的限制条件 + */ + sandbox: string; + /** + * @desc webview 的样式 + */ + webviewStyles: { + progress: + | { + color: string; + } + | boolean; + }; + /** + * @desc 是否自动更新当前页面标题 + */ + updateTitle: boolean; + /** + * @desc 网页向应用 postMessage 时，会在特定时机（后退、组件销毁、分享）触发并收到消息 + */ + onMessage: (event: TWebViewMessageEvent) => void; + /** + * @desc 网页向应用实时 postMessage + */ + onPostMessage: (event: TEvent) => void; }, {} >; From c7530ef88baeb52ab19ac21a94782ff70067b0e7 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 17:24:01 +0800 Subject: [PATCH 53/59] feat: update ad types --- index.d.ts | 121 ++++++++++++++++++++++++++++++++++++++++++----------- 1 file changed, 96 insertions(+), 25 deletions(-) diff --git a/index.d.ts b/index.d.ts index 8533d3f..8c1dda2 100644 --- a/index.d.ts +++ b/index.d.ts @@ -3574,33 +3574,92 @@ type TWebView = TComponent< {} >; -/** 用于展示微信开放的数据 */ -type TOpenData = TComponent< - { - /** 开放数据类型 */ - type: string; - /** 当 type="groupName" 时生效, 群id */ - openGid: string; - /** */ - lang: "ts"; - }, - {} ->; - -/** 广告 */ +/** + * @desc ad error 事件对象 + */ +type TAdErrorEvent = TEvent & { + detail: { + errCode: number; + }; +}; +/** + * @desc 广告 + */ type TAd = TComponent< { - /** App广告位id，在uni-AD官网申请广告位 */ - adpid: string; - }, - {} ->; - -/** Draw 信息流广告 */ -type TAdDraw = TComponent< - { - /** App广告位id，在uni-AD官网申请广告位 */ + /** + * @desc APP 广告位 id */ adpid: string; + /** + * @desc 广告单元 id，可在小程序管理后台的流量主模块新建 + */ + unitId: string; + /** + * @desc 广告自动刷新的间隔时间，必须大于等于 30 + * @desc 该参数不传入时 Banner 广告不会自动刷新 + * @desc 单位为 s + */ + adIntervals: number; + /** + * @desc 广告数据，优先级高于 adpid + */ + data: Record; + /** + * @desc 小程序应用 ID + */ + appid: string; + /** + * @desc 小程序广告位 ID + */ + apid: string; + /** + * @desc type 为 feeds 时广告左边距，必须大于 0 + * @desc 单位为 px + */ + adLeft: number; + /** + * @desc type 为 feeds 时广告上边距，必须大于 0 + * @desc 单位为 px + */ + adTop: number; + /** + * @desc type 为 feeds 时广告宽度，最大值为屏幕宽度，最小值为 265 + * @desc 单位为 px + * @desc 默认为 100% + */ + adWidth: number; + /** + * @desc type 为 feeds 时广告高度，最大值为 160，最小值为 85 + * @desc 单位为 px + */ + adHeight: number; + /** + * @desc 广告类型 + */ + type: + | "banner" + | "card" + | "feeds" + | "block" + | "feed" + | "video" + | "large" + | "llmg" + | "rlmg" + | "swip" + | "grid"; + /** + * @desc 广告加载成功的回调 + */ + onLoad: (event: TEvent) => void; + /** + * @desc 广告加载失败的回调 + */ + onError: (event: TAdErrorEvent) => void; + /** + * @desc 广告关闭的回调 + */ + onClose: (event: TEvent) => void; }, {} >; @@ -3723,6 +3782,19 @@ type TUnicloudDb = TComponent< {} >; +/** 用于展示微信开放的数据 */ +type TOpenData = TComponent< + { + /** 开放数据类型 */ + type: string; + /** 当 type="groupName" 时生效, 群id */ + openGid: string; + /** */ + lang: "ts"; + }, + {} +>; + declare module "@vue/runtime-core" { export interface GlobalComponents { Block: TBlock; @@ -3774,7 +3846,6 @@ declare module "@vue/runtime-core" { WebView: TWebView; Ad: TAd; - AdDraw: TAdDraw; UnicloudDb: TUnicloudDb; From 4862547151d7b4e8f97532114d6917710e3bf32a Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 19:03:45 +0800 Subject: [PATCH 54/59] feat: update unicloud-db types --- index.d.ts | 131 ++++++++++++++++++++++++++++++++++++++++++----------- 1 file changed, 104 insertions(+), 27 deletions(-) diff --git a/index.d.ts b/index.d.ts index 8c1dda2..1566e79 100644 --- a/index.d.ts +++ b/index.d.ts @@ -3741,43 +3741,120 @@ type TPageMeta = TComponent< {} >; -/** 是一个数据库查询组件，它是对uni-clientdb的js库的再封装。 */ +/** + * @desc 数据库查询组件，对 uni-clientdb 的 js 库的再封装 + */ type TUnicloudDb = TComponent< { - /** 表名 */ - collection: string | string; - /** 查询字段，多个字段用 `,` 分割 */ - field: string | string; - /** 查询条件 */ - where: string | string; - /** 云端执行数据库查询的前或后，触发某个action函数操作，进行预处理或后处理 */ - action: string | string; - /** 排序字段及正序倒叙设置 */ + /** + * @desc 服务空间信息 + */ + spaceInfo: { + provider: string; + spaceId: string; + clientSecret: string; + endpoint: string; + }; + /** + * @desc 表名 + */ + collection: string; + /** + * @desc 指定要查询的字段，多个字段用 , 分割 + */ + field: string; + /** + * @desc 查询条件，过滤记录 */ + where: string; + /** + * @desc 排序字段及正序倒序设置 + */ orderby: string; - /** 对数据进行分组 */ - groupby: string; - /** 对数据进行分组统计 */ - groupField: string; - /** 是否对数据查询结果中重复的记录进行去重 */ - distinct: boolean; - /** add 多次查询的集合, replace 当前查询的集合 */ + /** + * @desc 手动指定使用的关联关系 + */ + foreignKey: string; + /** + * @desc 分页策略 + * @desc 默认为 add + */ pageData: "add" | "replace"; - /** 当前页 */ + /** + * @desc 当前页 + */ pageCurrent: number; - /** 每页数据数量 */ + /** + * @desc 每页数据数量 + */ pageSize: number; - /** 指定查询结果是否返回数组第一条数据，默认 false。在false情况下返回的是数组，即便只有一条结果，也需要[0]的方式获取。在true下，直接返回结果数据，少一层数组 */ - getone: boolean; - /** 是否查询总数量 */ + /** + * @desc 是否查询总数据条数 + * @desc 默认 false + */ getcount: boolean; - /** 是否查询树状结构数据 */ + /** + * @desc 指定查询结果是否仅返回数组第一条数据 + * @desc false：结果数据外会再用数组包裹一层，一般用于列表页 + * @desc true：直接返回结果数据，一般用于非列表页 + * @desc 默认 false + */ + getone: boolean; + /** + * @desc 云端执行数据库查询的前或后，触发某个 action 函数操作，进行预处理或后处理 + * @desc 场景：前端无权操作的数据，比如阅读数 +1 + */ + action: string; + /** + * @desc 是否查询树状结构数据 + */ gettree: boolean; - /** gettree的第一层级条件，此初始条件可以省略，不传startWith时默认从最顶级开始查询 */ + /** + * @desc gettree 的第一层级条件 + * @desc 此初始条件可以省略，不传 startWith 时默认从最顶级开始查询 + */ startwith: string; - /** gettree查询返回的树的最大层级。超过设定层级的节点不会返回。默认10级，最大15，最小1 */ + /** + * @desce gettree查询返回的树的最大层级，超过设定层级的节点不会返回 + * @desc 取值范围为 1 - 15 + * @dsec 默认为 10*/ limitlevel: number; - /** 是否手动加载数据，默认为 false，页面onready时自动联网加载数据 */ - manual: boolean; + /** + * @desc 对数据进行分组 + */ + groupby: string; + /** + * @desc 对数据进行分组统计 + */ + groupField: string; + /** + * @desc 是否对数据查询结果中重复的记录进行去重 + * @desc 默认为 false + */ + distinct: boolean; + /** + * @desc 加载数据时机 + * @desc 默认为 auto + */ + loadtime: "auto" | "onready" | "manual"; + /** + * @desc 发行 H5 ssr 时有效，用于保证服务器端渲染和前端加载的数据对应 + * @desc 页面同时出现 2 个及以上 unicloud-db 组件需要配置此属性，且要保证值整个应用唯一 + * @desc 默认根据页面路径 + unicloud-db 组件代码中的行号生成唯一值 + */ + ssrKey: string; + /** + * @desc 成功回调 + * @desc 联网返回结果后，若希望先修改下数据再渲染界面，则在本方法里对 data 进行修改 + */ + onLoad: ( + data: any, + ended: boolean, + pagination: { size: number; count: number } + ) => void; + /** + * @desc 失败回调 + */ + onError: (event: TEvent) => void; }, {} >; From c4628f59cf072d6d8553e75dae2e2d8fbe8d4f7b Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 19:06:11 +0800 Subject: [PATCH 55/59] feat: update open-data types --- index.d.ts | 30 +++++++++++++++++++++++------- 1 file changed, 23 insertions(+), 7 deletions(-) diff --git a/index.d.ts b/index.d.ts index 1566e79..ad5a3b5 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1375,7 +1375,7 @@ type TInput = TComponent< autoFocus: boolean; /** * @desc 设置键盘右下角按钮的文字 - * @desc type="text" 时生效 + * @desc type="text" 时有效 */ confirmType: "send" | "search" | "next" | "go" | "done"; /** @@ -2450,7 +2450,7 @@ type TCamera = TComponent< onInitdone: (event: TCameraInitdoneEvent) => void; /** * @desc 扫码识别成功时触发 - * @desc mode="scanCode" 时生效 + * @desc mode="scanCode" 时有效 */ onScancode: (event: TEvent) => void; }, @@ -3862,12 +3862,28 @@ type TUnicloudDb = TComponent< /** 用于展示微信开放的数据 */ type TOpenData = TComponent< { - /** 开放数据类型 */ - type: string; - /** 当 type="groupName" 时生效, 群id */ + /** + * @desc 开放数据类型 + */ + type: + | "userNickName" + | "userAvatarUrl" + | "userGender" + | "groupName" + | "userCity" + | "userProvince" + | "userCountry" + | "userLanguage"; + /** + * @desc 群 ID + * @desc type="groupName" 时有效 + */ openGid: string; - /** */ - lang: "ts"; + /** + * @desc 以什么预压展示 userInfo + * @desc type="user*" 时有效 + */ + lang: "en" | "zh_CN" | "zh_TW"; }, {} >; From 72137a085cc29a8af8cdf326e35a1f25b883efd6 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 19:15:01 +0800 Subject: [PATCH 56/59] feat: update page-meta types --- index.d.ts | 81 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 81 insertions(+) diff --git a/index.d.ts b/index.d.ts index ad5a3b5..68224e5 100644 --- a/index.d.ts +++ b/index.d.ts @@ -3859,6 +3859,87 @@ type TUnicloudDb = TComponent< {} >; +/** + * @desc page-meta resize 事件对象 + */ +type TPageMetaResizeEvent = TEvent & { + detail: { + size: { + windowWidth: number; + windowHeight: number; + }; + }; +}; +/** + * @desc page-meta scroll 事件对象 + */ +type TPageMetaScrollEvent = TEvent & { + detail: { + scrollTop: number; + }; +}; +/** + * @desc 页面属性配置节点，用于指定页面的一些属性、监听页面事件 + * @desc 可部分替代 pages.json + * @desc 只能是页面内的第一个节点 + */ +type TPageMeta = TComponent< + { + /** + * @desc 下拉背景字体、loading 图的样式 + */ + backgroundTextStyle: "dark" | "light"; + /** + * @desc 窗口的背景色 + */ + backgroundColor: string; + /** + * @desc 顶部窗口的背景色，必须为十六进制颜色值，仅 iOS 支持 + */ + backgroundColorTop: string; + /** + * @desc 底部窗口的背景色，必须为十六进制颜色值，仅 iOS 支持 + */ + backgroundColorBottom: string; + /** + * @desc 滚动位置，在被设置时页面会滚动到对应位置 + * @desc 单位为 px / rpx + */ + scrollTop: string; + /** + * @desc 滚动动画时长 + * @desc 默认为 300 + */ + scrollDuration: number; + /** + * @desc 页面根节点样式 + * @desc 页面根节点是所有页面节点的祖先节点，相当于 HTML 中的 body 节点 + */ + pageStyle: string; + /** + * @desc 页面的根字体大小 + */ + rootFontSize: string; + /** + * @desc 是否开启自动下拉刷新 + * @desc 默认为 false + */ + enablePullDownRefresh: boolean; + /** + * @desc 页面尺寸变化时触发 + */ + onResize: (event: TPageMetaResizeEvent) => void; + /** + * @desc 页面滚动时触发 + */ + onScroll: (event: TPageMetaScrollEvent) => void; + /** + * @desc 通过改变 scroll-top 属性来使页面滚动，页面滚动结束后触发 + */ + onScrolldone: (event: TEvent) => void; + }, + {} +>; /** 用于展示微信开放的数据 */ type TOpenData = TComponent< { From 8e3b79f12002d2a294f61c649bdee7c03e0c3bcd Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 19:24:56 +0800 Subject: [PATCH 57/59] feat: update navigation-bar types --- index.d.ts | 168 +++++++++++++++++++++++++++++------------------------ 1 file changed, 91 insertions(+), 77 deletions(-) diff --git a/index.d.ts b/index.d.ts index 68224e5..663c091 100644 --- a/index.d.ts +++ b/index.d.ts @@ -3664,83 +3664,6 @@ type TAd = TComponent< {} >; -/** 页面导航条配置节点 */ -type TNavigationBar = TComponent< - { - /** 视频的标题，全屏时在顶部展示 */ - title: string; - /** 标题icon */ - titleIcon: boolean; - /** 标题icon圆角 */ - titleIconRadius: boolean; - /** */ - subtitleText: boolean; - /** */ - subtitleSize: boolean; - /** */ - subtitleColor: boolean; - /** */ - subtitleOverflow: boolean; - /** */ - titleAlign: boolean; - /** */ - backgroundImage: boolean; - /** */ - backgroundRepeat: boolean; - /** */ - blurEffect: boolean; - /** 是否在导航条显示 loading 加载提示 */ - loading: boolean; - /** 导航条前景颜色值，包括按钮、标题、状态栏的颜色，仅支持 #ffffff 和 #000000 */ - frontColor: boolean; - /** 窗口的背景色，必须为十六进制颜色值 */ - backgroundColor: string; - /** 改变导航栏颜色时的动画时长，默认为 0 （即没有动画效果） */ - colorAnimationDuration: boolean; - /** 改变导航栏颜色时的动画方式，支持 linear 、 easeIn 、 easeOut 和 easeInOut */ - colorAnimationTimingFunc: boolean; - }, - {} ->; - -/** 自定义tabBar */ -type TCustomTabBar = TComponent< - { - /** movable-view 的移动方向。 */ - direction: "all" | "vertical" | "horizontal" | "none"; - /** 是否显示icon */ - showIcon: boolean; - /** 选中的tabBar选项索引值 */ - selected: number; - }, - {} ->; - -/** 自定义tabBar */ -type TPageMeta = TComponent< - { - /** 下拉背景字体、loading 图的样式，仅支持 dark 和 light */ - backgroundTextStyle: string; - /** 窗口的背景色，必须为十六进制颜色值 */ - backgroundColor: string; - /** 顶部窗口的背景色，必须为十六进制颜色值，仅 iOS 支持 */ - backgroundColorTop: string; - /** 底部窗口的背景色，必须为十六进制颜色值，仅 iOS 支持 */ - backgroundColorBottom: string; - /** 滚动位置，可以使用 px 或者 rpx 为单位，在被设置时，页面会滚动到对应位置 */ - scrollTop: string; - /** 滚动动画时长 */ - scrollDuration: number; - /** 页面根节点样式，页面根节点是所有页面节点的祖先节点，相当于 HTML 中的 body 节点 */ - pageStyle: string; - /** 页面的根字体大小，页面中的所有 rem 单位，将使用这个字体大小作为参考值，即 1rem 等于这个字体大小 */ - rootFontSize: string; - /** */ - enablePullDownRefresh: boolean; - }, - {} ->; - /** * @desc 数据库查询组件，对 uni-clientdb 的 js 库的再封装 */ @@ -3940,6 +3863,97 @@ type TPageMeta = TComponent< }, {} >; + +/** + * @desc 页面导航条配置节点，用于指定导航栏的一些属性 + * @desc 只能是 page-meta 组件内的第一个节点，需要配合它一同使用 + */ +type TNavigationBar = TComponent< + { + /** + * @desc 导航条标题 + */ + title: string; + /** + * @desc 标题图标 + * @desc 仅支持本地文件路径、相对路径 + * @desc 固定宽高 34px + * @desc 设置后标题将居左显示 + */ + titleIcon: string; + /** + * @desc 标题图标圆角 + * @desc 单位为 px + */ + titleIconRadius: string; + /** + * @desc 副标题文字内容 + * @desc 设置副标题后将显示两行标题，副标题在主标题下方 + * @desc 设置副标题后将居左显示 + */ + subtitleText: string; + /** + * @desc 副标题文字字体大小 + * @desc 单位为 px + * @desc 默认为 12px + */ + subtitleSize: string; + /** + * @desc 副标题文字颜色 + * @desc 默认为主标题文字颜色 + */ + subtitleColor: string; + /** + * @desc 副标题文字超出显示区域时处理方式 + * @desc 默认为 ellipsis + */ + subtitleOverflow: "clip" | "ellipsis"; + /** + * @desc 标题对齐方式 + * @desc 默认 Android left，iOS center + */ + titleAlign: "center" | "left" | "auto"; + /** + * @desc 背景图片 + * @desc 支持本地文件路径、相对路径、渐变色 + */ + backgroundImage: string; + /** + * @desc 背景图片重复方式 + * @desc backgroundImage 设置为图片路径时有效 + * @desc 默认为 no-repeat + */ + backgroundRepeat: "repeat" | "repeat-x" | "repeat-y" | "no-repeat"; + /** + * @desc 高斯模糊标题栏的风格 + */ + blurEffect: "none" | "dark" | "extralight" | "light"; + /** + * @desc 是否在导航条显示 loading 加载提示 + * @desc 默认为 false + */ + loading: boolean; + /** + * @desc 导航条前景颜色值，包括按钮、标题、状态栏的颜色 + */ + frontColor: "#ffffff" | "#000000"; + /** + * @desc 导航条背景颜色值 + */ + backgroundColor: string; + /** + * @desc 改变导航栏颜色时的动画时长 + * @desc 默认为 0 + */ + colorAnimationDuration: number; + /** + * @desc 改变导航栏颜色时的动画方式 + */ + colorAnimationTimingFunc: "linear" | "easeIn" | "easeOut" | "easeInOut"; + }, + {} +>; + /** 用于展示微信开放的数据 */ type TOpenData = TComponent< { From 334087cd4bbdace3d90657b7811f557cfc5abf27 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 19:27:03 +0800 Subject: [PATCH 58/59] feat: update custom-tab-bar types --- index.d.ts | 28 ++++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) diff --git a/index.d.ts b/index.d.ts index 663c091..7a7928e 100644 --- a/index.d.ts +++ b/index.d.ts @@ -3954,6 +3954,34 @@ type TNavigationBar = TComponent< {} >; +/** + * @desc 自定义 tabBar 组件 + */ +type TCustomTabBar = TComponent< + { + /** + * @desc 选项的排列方向 + * @desc 默认为 horizontal + */ + direction: "vertical" | "horizontal"; + /** + * @desc 是否显示 icon + * @desc 默认为 false + */ + showIcon: boolean; + /** + * @desc 选中的 tabBar 选项索引值 + * @desc 默认为 0 + */ + selected: number; + /** + * @desc 点击事件 + */ + onTabItemTap: (index: number, pagePath: string, text: string) => void; + }, + {} +>; + /** 用于展示微信开放的数据 */ type TOpenData = TComponent< { From 610224a449ea89bd919516d6914bbbe87ecbb411 Mon Sep 17 00:00:00 2001 From: ModyQyW Date: Thu, 14 Jul 2022 19:33:15 +0800 Subject: [PATCH 59/59] feat: add types --- index.d.ts | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/index.d.ts b/index.d.ts index 7a7928e..05884e7 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1,3 +1,6 @@ +// TODO 需要补充 ad 相关组件 +// TODO 需要补充 nvue 组件 + import type { DefineComponent, ComputedOptions, @@ -4069,13 +4072,6 @@ declare module "@vue/runtime-core" { NavigationBar: TNavigationBar; CustomTabBar: TCustomTabBar; - Barcode: TBarcode; - List: TList; - Cell: TCell; - RecycleList: TRecycleList; - Waterfall: TWaterfall; - Refresh: TRefresh; - OpenData: TOpenData; } }