@cloudbase/weda-ui 0.2.11 → 0.2.12

package/CHANGELOG.md

@@ -0,0 +1,240 @@
+> 为了更好的区分组件类型，仅在更新日志中进行如下约定：低码组件使用大驼峰命名，源码组件使用小驼峰命名。
+
+## [1.2] - 2021-08-24
+
+### Changed
+
+- swiper 轮播
+
+  - 添加示例图片
+
+## [1.1] - 2021-08-09
+
+### Added
+
+- text 文本
+
+  - 新增事件 `tap`
+
+- modal 模态弹窗
+
+  - 新增组件 `modal`, web 使用 tea 样式用于 PC 样式响应式。
+
+- showModal 显示弹窗
+
+  - 新增动作 `showModal`，用于平台方法的 PC 大屏响应式版本，小程序对齐 wx.showModal api。
+
+- FormTextarea 表单多行输入
+
+  - 新增组件 `FormTextarea`, 用以替代被移除的 `Textarea` 组件
+
+- link 链接
+
+  - 新增组件 `link`，可通过插槽来配置自定义内容
+
+### Changed
+
+- button 按钮
+
+  - 添加响应式样式，屏幕宽度大于 **1024px** 时显示为方角
+
+- swiper 轮播
+
+  - 添加响应式样式，屏幕宽度大于 1024px 时显示为方角
+
+- FormRadio 表单单选
+
+  - 修复多个单选组件并存导致的选中问题
+
+- FormCheckbox 表单复选
+
+  - 修复多个复选组件并存导致的选中问题
+
+- 所有组件:
+  - 表单组件的默认背景色，统一配置为透明
+  - 组件最外层容器统一添加 `weda-ui` 类名，组件库级别重置样式及公共样式都限制在 `weda-ui` 类名下，防止污染
+  - 规范了组件事件的触发方式
+
+## [1.0] - 2021-06-10
+
+### Added
+
+- text 文本:
+
+  - 新增属性 `maxLines` 最大显示行数
+
+- FormRegion 表单区域选择:
+
+  - 新增组件 `FormRegion`, 用以替代被移除的 `RegionPicker` 组件
+
+### Removed
+
+- swiper 轮播:
+
+  - 移除属性 `displayMultipleItems`, `nextMargin`, `previousMargin`, `updated`
+  - 移除 `transition` 和 `animationfinished` 事件
+
+- text 文本:
+
+  - 移除属性 `decode` 是否解码
+  - 移除 `tap` 事件
+
+- image 图片:
+
+  - 移除属性 `webp` 能否解析 webp 格式
+
+- button 按钮:
+
+  - 移除属性 `plain` 镂空
+  - 移除属性 `openType` 微信开放能力的 `获取用户信息` 选项
+
+- FormInput 表单输入:
+
+  - 移除属性 `requiredFlag` 是否需要必填星号
+  - 移除属性 `underline` 是否需要底部下划线
+
+- FormRadio 表单单选:
+
+  - 移除属性 `validateTrigger` 字段触发校验类型
+  - 移除属性 `validateStatus` 校验状态
+  - 移除属性 `requiredFlag` 是否需要必填星号
+  - 移除属性 `underline` 是否需要底部下划线
+
+- FormCheckbox 表单复选:
+
+  - 移除属性 `validateTrigger` 字段触发校验类型
+  - 移除属性 `validateStatus` 校验状态
+  - 移除属性 `requiredFlag` 是否需要必填星号
+  - 移除属性 `underline` 是否需要底部下划线
+
+- FormSwitch 表单开关:
+
+  - 移除属性 `type` 显示类型
+  - 移除属性 `checkedIcon` 选中图标
+  - 移除属性 `uncheckedIcon` 非选中图标
+  - 移除属性 `requiredFlag` 是否需要必填星号
+  - 移除属性 `underline` 是否需要底部下划线
+
+- FormDate 表单日期:
+
+  - 移除属性 `suffixType` 操作尾部样式类型
+  - 移除属性 `suffixText` 操作尾部文案
+  - 移除属性 `requiredFlag` 是否需要必填星号
+  - 移除属性 `underline` 是否需要底部下划线
+
+- FormTime 表单时间:
+
+  - 移除属性 `suffixType` 操作尾部样式类型
+  - 移除属性 `suffixText` 操作尾部文案
+  - 移除属性 `requiredFlag` 是否需要必填星号
+  - 移除属性 `underline` 是否需要底部下划线
+
+- FormSelect 表单选择:
+
+  - 移除属性 `suffixType` 操作尾部样式类型
+  - 移除属性 `suffixText` 操作尾部文案
+  - 移除属性 `validateTrigger` 字段触发校验类型
+  - 移除属性 `validateStatus` 校验状态
+  - 移除属性 `rules` 校验规则
+  - 移除属性 `requiredFlag` 是否需要必填星号
+  - 移除属性 `underline` 是否需要底部下划线
+
+- FormPhone 表单手机号码:
+
+  - 移除属性 `maxLength` 最大输入长度
+  - 移除属性 `rules` 校验规则
+  - 移除属性 `requiredFlag` 是否需要必填星号
+  - 移除属性 `underline` 是否需要底部下划线
+
+- FormEmail 表单邮件地址:
+
+  - 移除属性 `rules` 校验规则
+  - 移除属性 `requiredFlag` 是否需要必填星号
+  - 移除属性 `underline` 是否需要底部下划线
+
+- FormUrl 表单邮件地址:
+
+  - 移除属性 `rules` 校验规则
+  - 移除属性 `requiredFlag` 是否需要必填星号
+  - 移除属性 `underline` 是否需要底部下划线
+
+- FormItem 表单元素:
+
+  - 移除组件
+
+- FormCell 表单表格:
+
+  - 移除组件
+
+- RegionPicker 地域选择:
+
+  - 移除组件
+
+- Textarea 多行输入:
+
+  - 移除组件, 待优化后重新上架
+
+### Changed
+
+- image 图片:
+
+  - 默认大小由 320\*240 rpx 调整为 240\*240 rpx
+
+- text 文本:
+
+  - 跟随小程序定义，`selectabble` 变更为 `userSelect`
+  - 样式调整：默认布局模式从 `inline` 编程 `block`
+
+- button 按钮：
+
+  - 样式调整：从默认宽度 `100%` 调整为默认 `184px`
+
+- Form 表单容器:
+
+  - 样式优化
+
+- FormInput 表单输入:
+
+  - 样式优化
+
+- FormRadio 表单单选:
+
+  - 属性 `name` 表单字段名称，默认值由 `thisIsRadioKey` 改为 `formRadio`
+  - 样式优化
+
+- FormCheckbox 表单复选:
+
+  - 属性 `name` 表单字段名称，默认值由 `thisIsCheckboxKey` 改为 `formCheckbox`
+  - 样式优化
+
+- FormSwitch 表单开关:
+
+  - 属性 `name` 表单字段名称，默认值由 `thisIsSelectKey` 改为 `formSwitch`
+  - 样式优化
+
+- FormDate 表单日期:
+
+  - 属性 `name` 表单字段名称，默认值由 `thisIsDateKey` 改为 `formDate`
+  - 样式优化
+
+- FormTime 表单时间:
+
+  - 属性 `name` 表单字段名称，默认值由 `thisIsTimeKey` 改为 `formTime`
+  - 样式优化
+
+- FormSelect 表单选择:
+
+  - 属性 `name` 表单字段名称，默认值由 `thisIsSelectKey` 改为 `formSelect`
+  - 样式优化
+
+- FormPhone 表单手机号码:
+
+  - 样式优化
+
+- FormEmail 表单邮件地址:
+
+  - 样式优化
+
+- FormUrl 表单邮件地址:
+
+  - 样式优化

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudbase/weda-ui",
-  "version": "0.2.11",
+  "version": "0.2.12",
   "main": "./src/index.js",
   "module": "./src/index",
   "miniprogram": "mpdist",
@@ -16,15 +16,19 @@
     "access": "public"
   },
   "scripts": {
-    "test": "jest test --env=jsdom --watch",
-    "test-once": "jest test --env=jsdom",
+    "dev": "tcb lowcode debug",
+    "build:cli": "tcb lowcode build",
+    "build:analyze": "cross-env ANALYZER=1 tcb lowcode build",
+    "test": "jest test --env=jsdom",
+    "test:watch": "jest test --env=jsdom --watch",
     "storybook": "start-storybook -p 6006",
     "build-storybook": "build-storybook",
     "lint": "eslint src --fix",
     "prepare": "husky install",
     "build-npm": "rimraf dist && mkdir dist && cp -r src/web dist/ && cp -r src/configs dist/ && cp src/index.js dist/",
     "build-mp": "rimraf mpdist && cp -r src/mp mpdist",
-    "clear:snap": "rimraf ./src/test/__snapshots__"
+    "clear:snap": "rimraf ./src/test/__snapshots__",
+    "size": "npm run build:cli && size-limit"
   },
   "keywords": [
     "weda",
@@ -36,16 +40,16 @@
   "description": "腾讯云微搭低代码组件库模板",
   "dependencies": {
     "@cloudbase/ui-react": "^1.0.4",
-    "@use-gesture/react": "^10.1.4",
+    "@loadable/component": "^5.15.2",
+    "@react-hookz/web": "^12.0.0",
+    "@use-gesture/react": "^10.2.4",
     "braft-editor": "^2.3.9",
     "braft-utils": "^3.0.12",
-    "dayjs": "^1.10.6",
+    "dayjs": "^1.10.7",
     "lodash.isequal": "^4.5.0",
-    "moment": "^2.29.1",
-    "object.fromentries": "^2.0.4",
+    "object.fromentries": "^2.0.5",
     "prop-types": "^15.7.2",
-    "react-easy-swipe": "^0.0.21",
-    "react-use": "^15.3.4",
+    "react-easy-swipe": "0.0.22",
     "tea-component": "^2.7.3",
     "uuid": "8.3.2",
     "weui": "^2.4.4",
@@ -55,48 +59,65 @@
     "react": ">=16.8.0"
   },
   "devDependencies": {
-    "@babel/preset-env": "^7.15.6",
-    "@babel/preset-react": "^7.14.5",
-    "@cloudbase/lowcode-build-dependence": "^0.7.2",
+    "@babel/preset-env": "^7.16.5",
+    "@babel/preset-react": "^7.16.5",
+    "@babel/preset-typescript": "^7.16.5",
+    "@cloudbase/lowcode-build-dependence": "^0.9.0",
+    "@commitlint/cli": "^16.0.2",
     "@commitlint/config-conventional": "^13.2.0",
-    "@storybook/addon-actions": "^6.3.10",
-    "@storybook/addon-essentials": "^6.3.10",
-    "@storybook/addon-links": "^6.3.10",
-    "@storybook/addon-storyshots": "^6.3.10",
-    "@storybook/react": "^6.3.10",
-    "@testing-library/jest-dom": "^5.14.1",
-    "@testing-library/react": "^12.0.0",
+    "@size-limit/preset-big-lib": "^7.0.5",
+    "@storybook/addon-actions": "^6.4.9",
+    "@storybook/addon-essentials": "^6.4.9",
+    "@storybook/addon-links": "^6.4.9",
+    "@storybook/addon-storyshots": "^6.4.9",
+    "@storybook/react": "^6.4.9",
+    "@testing-library/jest-dom": "^5.16.1",
+    "@testing-library/react": "^12.1.2",
     "@testing-library/react-hooks": "^7.0.2",
-    "babel-jest": "^27.2.0",
-    "eslint": "^7.32.0",
+    "@types/jest": "^27.0.3",
+    "@types/resize-observer-browser": "^0.1.6",
+    "@typescript-eslint/eslint-plugin": "^5.9.0",
+    "@typescript-eslint/parser": "^5.9.0",
+    "babel-jest": "^27.4.5",
+    "babel-loader": "^8.2.3",
+    "cross-env": "^7.0.3",
+    "eslint": "^8.4.1",
     "eslint-config-tencent": "^1.0.2",
-    "eslint-plugin-jest": "^25.0.5",
-    "eslint-plugin-react": "^7.26.1",
-    "husky": "^7.0.0",
+    "eslint-plugin-jest": "^25.3.0",
+    "eslint-plugin-react": "^7.27.1",
+    "husky": "^7.0.4",
     "identity-obj-proxy": "^3.0.0",
-    "jest": "^27.2.0",
+    "jest": "^27.4.5",
     "less": "^4.1.2",
-    "miniprogram-simulate": "^1.4.0",
+    "miniprogram-simulate": "^1.4.3",
+    "nano-staged": "^0.5.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-test-renderer": "^17.0.2",
     "rimraf": "^3.0.2",
-    "ts-jest": "^27.0.5",
-    "typescript": "^4.4.3"
-  },
-  "jest": {
-    "transformIgnorePatterns": [
-      "node_modules/(?!(react-syntax-highlighter)/)"
-    ],
-    "moduleNameMapper": {
-      "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/src/test/__mocks__/fileMock.js",
-      "\\.(css|less|scss|sass)$": "identity-obj-proxy"
-    }
+    "size-limit": "^7.0.5",
+    "ts-jest": "^27.1.1",
+    "ts-loader": "^8.2.0",
+    "typescript": "^4.5.4",
+    "webpack": "4.44.2"
   },
   "babel": {
     "presets": [
       "@babel/preset-env",
-      "@babel/preset-react"
+      "@babel/preset-react",
+      "@babel/preset-typescript"
+    ]
+  },
+  "nano-staged": {
+    "*.{js,jsx,ts,tsx}": [
+      "eslint --fix"
     ]
-  }
+  },
+  "size-limit": [
+    {
+      "path": ".temp/dist/*.main.*",
+      "webpack": false,
+      "limit": "700 KB"
+    }
+  ]
 }

package/src/configs/components/button.json

@@ -15,12 +15,16 @@
         "x-component": "radio",
         "enum": [
           {
-            "label": "default",
+            "label": "中",
             "value": "default"
           },
           {
-            "label": "mini",
+            "label": "小",
             "value": "mini"
+          },
+          {
+            "label": "大",
+            "value": "large"
           }
         ],
         "x-category": "基础属性"
@@ -182,7 +186,7 @@
     "name": "Button",
     "title": "按钮",
     "description": "按钮组件",
-    "icon": "./button.svg",
+    "icon": "//imgcache.qq.com/qcloud/lowcode/static/ide/left-material-icon/Button.svg",
     "category": "展示",
     "categoryOrder": 1,
     "componentOrder": 1

package/src/configs/components/form/richText.json

@@ -114,7 +114,7 @@
       "title": "富文本",
       "description": "富文本编辑器",
       "category": "表单",
-      "icon": "//main.qcloudimg.com/raw/adc8cd1b6eb93c0f890ca2322e509a6b/RichText.svg"
+      "icon": "//imgcache.qq.com/qcloud/lowcode/static/ide/left-material-icon/RichText.svg"
   },
   "events": [
     {

package/src/configs/components/form/uploader.json

@@ -108,6 +108,34 @@
         "title": "是否返回单张图片",
         "x-category": "基础属性"
       },
+      "required": {
+        "type": "boolean",
+        "title": "是否必填",
+        "default": false,
+        "x-index": 190,
+        "x-category": "高级属性",
+        "x-linkages": [
+          {
+            "type": "value:visible",
+            "target": "*(requiredFlag,requiredMsg)",
+            "condition": "{{$self.value}}"
+          }
+        ]
+      },
+      "requiredMsg": {
+        "type": "string",
+        "title": "校验错误提示",
+        "default": "该项为必填项",
+        "x-index": 191,
+        "x-category": "高级属性"
+      },
+      "requiredFlag": {
+        "type": "boolean",
+        "title": "显示必填标记",
+        "default": false,
+        "x-index": 192,
+        "x-category": "高级属性"
+      },
       "defaultValue": {
         "x-category": "基础属性",
         "title": "初始默认值",
@@ -136,6 +164,6 @@
     "title": "上传图片",
     "description": "上传图片组件",
     "category": "表单",
-    "icon": "//main.qcloudimg.com/raw/f781e6bc48efa1cf926fc768fceeab5e/Uploader.svg"
+    "icon": "//imgcache.qq.com/qcloud/lowcode/static/ide/left-material-icon/UploadImage.svg"
   }
 }

package/src/configs/components/form/uploaderFile.json

@@ -0,0 +1,158 @@
+{
+  "$schema": "https://comp-public-1303824488.cos.ap-shanghai.myqcloud.com/schema/lcds_component.json",
+  "data": {
+    "properties": {
+      "label": {
+        "type": "string",
+        "default": "上传文件",
+        "title": "标题",
+        "x-category": "基础属性",
+        "x-index": 10
+      },
+      "labelVisible": {
+        "type": "boolean",
+        "default": true,
+        "title": "显示标题",
+        "x-category": "基础属性",
+        "x-index": 20
+      },
+      "single": {
+        "type": "boolean",
+        "default": true,
+        "title": "单个文件上传模式",
+        "x-category": "基础属性",
+        "x-index": 30
+      },
+
+      "maxUploadCount": {
+        "type": "number",
+        "default": 9,
+        "title": "上传文件最大数量",
+        "x-category": "基础属性",
+        "x-index": 40
+      },
+      "downloadVisible": {
+        "type": "boolean",
+        "default": true,
+        "title": "显示下载按钮",
+        "x-category": "基础属性",
+        "x-index": 50
+      },
+      "deleteVisible": {
+        "type": "boolean",
+        "default": true,
+        "title": "显示删除按钮",
+        "x-category": "基础属性",
+        "x-index": 60
+      },
+      "defaultValue": {
+        "x-category": "基础属性",
+        "title": "初始默认值",
+        "type": "array",
+        "items": {
+          "type": "string"
+        },
+        "x-index": 70
+      },
+      "maxSize": {
+        "type": "number",
+        "default": 1024,
+        "title": "单个文件最大限制(M)",
+        "description": "最大支持1024M",
+        "x-category": "高级属性",
+        "x-index": 80
+      },
+      "layout": {
+        "title": "布局方式",
+        "type": "string",
+        "default": "horizontal",
+        "x-category": "高级属性",
+        "enum": [
+          {
+            "label": "水平",
+            "value": "horizontal"
+          },
+          {
+            "label": "垂直",
+            "value": "vertical"
+          }
+        ],
+        "x-index": 90
+      },
+      "acceptTypes": {
+        "type": "array",
+        "title": "文件类型",
+        "x-platforms": ["WEB"],
+        "default": ["*"],
+        "x-category": "高级属性",
+        "x-index": 100,
+        "items": {
+          "type": "string",
+          "enum": [
+            {
+              "label": "全部",
+              "value": "*"
+            },
+            {
+              "label": "png",
+              "value": "image/png"
+            },
+            {
+              "label": "jpeg",
+              "value": "image/jpeg"
+            },
+            {
+              "label": "pdf",
+              "value": "application/pdf"
+            },
+            {
+              "label": "doc",
+              "value": "application/msword"
+            },
+            {
+              "label": "xls",
+              "value": "application/vnd.ms-excel"
+            },
+            {
+              "label": "zip",
+              "value": "application/zip"
+            }
+          ]
+        }
+      },
+      "requiredFlag": {
+        "type": "boolean",
+        "default": false,
+        "title": "是否必填",
+        "x-category": "高级属性",
+        "x-index": 110
+      },
+      "disabled": {
+        "type": "boolean",
+        "default": false,
+        "title": "是否禁用",
+        "x-category": "高级属性",
+        "x-index": 120
+      }
+    }
+  },
+  "events": [
+    {
+      "name": "success",
+      "title": "上传成功"
+    },
+    {
+      "name": "error",
+      "title": "上传失败"
+    },
+    {
+      "name": "change",
+      "title": "值变化"
+    }
+  ],
+  "meta": {
+    "title": "上传文件",
+    "description": "上传文件组件",
+    "category": "表单"
+  }
+}

package/src/configs/components/image.json

@@ -28,11 +28,20 @@
         "title": "点击预览大图",
         "type": "boolean",
         "default": false,
-        "x-category": "基础属性"
+        "x-index": 3,
+        "x-category": "基础属性",
+        "x-linkages": [
+          {
+            "type": "value:visible",
+            "target": "maskClosable",
+            "condition": "{{ $self.value }}"
+          }
+        ]
       },
       "maskClosable": {
-        "title": "点击遮罩关闭图片预览",
+        "title": "再次点击关闭预览",
         "type": "boolean",
+        "x-index": 4,
         "default": true,
         "x-category": "基础属性"
       },
@@ -44,7 +53,7 @@
         "description": "图片按需加载，若图片没有被展示，则不会加载"
       },
       "fit": {
-        "title": "图片布局模式",
+        "title": "布局模式",
         "type": "string",
         "default": "cover",
         "enum": [