@tuya-miniapp/smart-ui 2.3.0-beta-4 → 2.3.0-beta-5

package/README-zh_CN.md

@@ -0,0 +1,66 @@
+[English](./README.md) | 简体中文
+
+# @tuya-miniapp/smart-ui
+
+## 介绍
+
+`@tuya-miniapp/smart-ui` 是一个**轻量、可靠的智能小程序组件库**，其基于 `vant-weapp` 实现，提供了一整套符合智能小程序移动端设计规范的 UI 组件。
+
+## 预览
+
+扫描下方智能小程序二维码，体验组件库示例。
+
+<img src="https://images.tuyacn.com/rms-static/8bcfe810-a187-11ef-9773-6b86083026a3-1731478901009.png?tyName=v2.0.0miniapp-SmartUI.png" width="200" height="200">
+
+## 使用之前
+
+使用 Smart UI 前，请确保你已经学习过智能小程序官方的 [智能小程序快速开始](https://developer.tuya.com/cn/miniapp/develop/miniapp/guide/start/smart) 和 [小程序组件介绍](https://developer.tuya.com/cn/miniapp/develop/miniapp/framework/component/intro)。
+
+## 安装
+
+```bash
+# 通过 yarn 安装（推荐）
+yarn add @tuya-miniapp/smart-ui
+
+# 通过 npm 安装
+npm i @tuya-miniapp/smart-ui
+```
+
+## 使用组件
+
+以按钮组件为例，只需要在 json 文件中引入按钮对应的自定义组件即可
+
+```json
+{
+  "usingComponents": {
+    "smart-button": "@tuya-miniapp/smart-ui/lib/button/index"
+  }
+}
+```
+
+接着就可以在 tyml 中直接使用组件
+
+```html
+<smart-button type="primary">按钮</smart-button>
+```
+
+## 在开发者工具中预览
+
+```bash
+# 安装项目依赖
+yarn
+
+# 执行组件编译
+yarn dev
+```
+
+打开 [Tuya MiniApp Tools](https://developer.tuya.com/cn/miniapp/devtools/tools)，把`smart-ui/example`目录添加进去就可以预览示例了。
+
+## 基础库版本
+
+`@tuya-miniapp/smart-ui` 从智能小程序基础库 `2.19.0` 版本开始提供稳定的支持。
+
+## 开源协议
+
+本项目基于 [MIT](https://zh.wikipedia.org/wiki/MIT%E8%A8%B1%E5%8F%AF%E8%AD%89) 协议，请自由地享受和参与开源。
+

package/dist/calendar/index.js

@@ -416,6 +416,7 @@ SmartComponent({
             if (maxRange && calcDateNum(date) > maxRange) {
                 if (showRangePrompt) {
                     Toast({
+                        selector: '#smart-toast-calendar',
                         context: this,
                         message: rangePrompt || `选择天数不能超过 ${maxRange} 天`,
                     });

package/dist/calendar/index.json

@@ -6,7 +6,6 @@
     "month-list": "../calendar-month-list/index",
     "year-list": "../calendar-year-list/index",
     "smart-button": "../button/index",
-    "smart-popup": "../popup/index",
-    "smart-toast": "../toast/index"
+    "smart-popup": "../popup/index"
   }
 }

package/dist/calendar/index.wxml

@@ -23,5 +23,3 @@
 </smart-popup>
 
 <include wx:else src="./calendar.wxml" />
-
-<smart-toast id="smart-toast" />

package/dist/popover/index.js

@@ -161,7 +161,7 @@ SmartComponent({
             this.setData({
                 currentShow: true,
             });
-            this.$emit('showchange', true);
+            this.$emit('show-change', true);
             if (this.data.duration) {
                 setTimeout(() => {
                     this.onClose();
@@ -172,7 +172,7 @@ SmartComponent({
             this.setData({
                 currentShow: false,
             });
-            this.$emit('showchange', false);
+            this.$emit('show-change', false);
             this.$emit('close', false);
         },
     },

package/dist/toast/toast.js

@@ -32,7 +32,7 @@ function Toast(toastOptions) {
         getCurrentPage();
     const toast = context.selectComponent(options.selector);
     if (!toast) {
-        console.warn('未找到 smart-toast 节点，请确认 selector 及 context 是否正确');
+        console.warn(`未找到 ${options.selector || '#smart-toast'} 节点，请确认 selector 及 context 是否正确`);
         return;
     }
     delete options.context;

package/lib/calendar/index.js

@@ -434,6 +434,7 @@ var getTime = function (date) { return (date instanceof Date ? date.getTime() :
             if (maxRange && (0, utils_1.calcDateNum)(date) > maxRange) {
                 if (showRangePrompt) {
                     (0, toast_1.default)({
+                        selector: '#smart-toast-calendar',
                         context: this,
                         message: rangePrompt || "\u9009\u62E9\u5929\u6570\u4E0D\u80FD\u8D85\u8FC7 ".concat(maxRange, " \u5929"),
                     });

package/lib/calendar/index.json

@@ -6,7 +6,6 @@
     "month-list": "../calendar-month-list/index",
     "year-list": "../calendar-year-list/index",
     "smart-button": "../button/index",
-    "smart-popup": "../popup/index",
-    "smart-toast": "../toast/index"
+    "smart-popup": "../popup/index"
   }
 }

package/lib/calendar/index.wxml

@@ -23,5 +23,3 @@
 </smart-popup>
 
 <include wx:else src="./calendar.wxml" />
-
-<smart-toast id="smart-toast" />

package/lib/popover/index.js

@@ -177,7 +177,7 @@ function createSvgIcon(svg) {
             this.setData({
                 currentShow: true,
             });
-            this.$emit('showchange', true);
+            this.$emit('show-change', true);
             if (this.data.duration) {
                 setTimeout(function () {
                     _this.onClose();
@@ -188,7 +188,7 @@ function createSvgIcon(svg) {
             this.setData({
                 currentShow: false,
             });
-            this.$emit('showchange', false);
+            this.$emit('show-change', false);
             this.$emit('close', false);
         },
     },

package/lib/toast/toast.js

@@ -46,7 +46,7 @@ function Toast(toastOptions) {
         (0, utils_1.getCurrentPage)();
     var toast = context.selectComponent(options.selector);
     if (!toast) {
-        console.warn('未找到 smart-toast 节点，请确认 selector 及 context 是否正确');
+        console.warn("\u672A\u627E\u5230 ".concat(options.selector || '#smart-toast', " \u8282\u70B9\uFF0C\u8BF7\u786E\u8BA4 selector \u53CA context \u662F\u5426\u6B63\u786E"));
         return;
     }
     delete options.context;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tuya-miniapp/smart-ui",
-  "version": "2.3.0-beta-4",
+  "version": "2.3.0-beta-5",
   "author": "MiniApp Team",
   "license": "MIT",
   "miniprogram": "lib",
@@ -22,8 +22,10 @@
   "files": [
     "dist",
     "!dist/**/demo/",
+    "lib",
     "!lib/**/demo/",
-    "lib"
+    "README-zh_CN.md",
+    "README.md"
   ],
   "husky": {
     "hooks": {
@@ -49,6 +51,7 @@
     "@types/fs-extra": "^11.0.4",
     "@types/jest": "^27.0.2",
     "@vant/stylelint-config": "^1.4.2",
+    "canvas": "^3.1.0",
     "conventional-changelog-cli": "^5.0.0",
     "eslint-config-tuya-panel": "^0.4.2",
     "eslint-plugin-literal-check": "^0.1.2",
@@ -62,6 +65,7 @@
     "gulp-typescript": "^6.0.0-alpha.1",
     "husky": "^8.0.3",
     "jest": "^27.3.1",
+    "jest-canvas-mock": "^2.5.2",
     "lint-staged": "^13.0.3",
     "merge2": "^1.4.1",
     "miniprogram-api-typings": "^3.1.6",

package/lib/action-sheet/demo/index.d.ts

@@ -1 +0,0 @@
-export {};

package/lib/action-sheet/demo/index.js

@@ -1,124 +0,0 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var component_1 = require("../../common/component");
-(0, component_1.SmartComponent)({
-    data: {
-        show1: false,
-        show2: false,
-        show3: false,
-        show4: false,
-        show5: false,
-        showSelect: false,
-        showSelect2: false,
-        showNumber: false,
-        showPicker: false,
-        isReady: false,
-        action1: [{ name: 'Action' }, { name: 'Action' }, { name: 'Action' }],
-        action2: [
-            { name: I18n.t('coloringOptions'), color: '#ee0a24' },
-            { loading: true },
-            { name: I18n.t('disableOption'), disabled: true },
-        ],
-        actionSelect: [
-            { id: 0, name: 'Action', checked: true },
-            { id: 1, name: 'Action', checked: false },
-            { id: 2, name: 'Action', checked: false },
-            { id: 3, name: 'Action', checked: false },
-            { id: 4, name: 'Action', checked: false },
-            { id: 5, name: 'Action', checked: false },
-            { id: 6, name: 'Action', checked: false },
-            { id: 7, name: 'Action', checked: false },
-        ],
-        currentNumber: 0,
-        currentDate: new Date(2018, 0, 1),
-        currentDateStr: new Date(2018, 0, 1).toLocaleDateString(),
-        minDate: new Date(2018, 0, 1).getTime(),
-        formatter: function (type, value) {
-            if (type === 'year') {
-                return "".concat(value).concat(I18n.t('year'));
-            }
-            if (type === 'month') {
-                return "".concat(value).concat(I18n.t('month'));
-            }
-            return value;
-        },
-    },
-    methods: {
-        toggle: function (type) {
-            var _a;
-            this.setData((_a = {},
-                _a[type] = !this.data[type],
-                _a));
-        },
-        toggleActionSheet1: function () {
-            this.toggle('show1');
-        },
-        toggleActionSheet2: function () {
-            this.toggle('show2');
-        },
-        toggleActionSheet3: function () {
-            this.toggle('show3');
-        },
-        toggleActionSheet4: function () {
-            this.toggle('show4');
-        },
-        toggleActionSheet5: function () {
-            this.toggle('show5');
-        },
-        toggleActionSheet6: function () {
-            this.toggle('show6');
-        },
-        toggleActionSheetSelect: function () {
-            this.toggle('showSelect');
-        },
-        toggleActionSheetSelect2: function () {
-            this.toggle('showSelect2');
-        },
-        toggleActionSheetNumber: function () {
-            this.toggle('showNumber');
-        },
-        toggleActionSheetPicker: function () {
-            this.toggle('showPicker');
-        },
-        onAfterEnter: function () {
-            this.setData({ isReady: true });
-        },
-        onChange: function (event) {
-            this.setData({ currentNumber: event.detail.value });
-        },
-        onSelect: function (evt) {
-            var id = evt.detail.id;
-            var newActionSelect = this.data.actionSelect.map(function (item) {
-                if (item.id === id)
-                    return __assign(__assign({}, item), { checked: true });
-                return __assign(__assign({}, item), { checked: false });
-            });
-            this.setData({
-                actionSelect: newActionSelect,
-            });
-        },
-        onInput: function (event) {
-            var detail = event.detail;
-            var date = new Date(detail);
-            this.setData({ currentDate: date });
-        },
-        onPickerConfirm: function () {
-            var _a, _b;
-            this.setData({
-                showPicker: false,
-                currentDateStr: (_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a.currentDate) === null || _b === void 0 ? void 0 : _b.toLocaleDateString(),
-            });
-        },
-    },
-});

package/lib/area/demo/index.d.ts

@@ -1 +0,0 @@
-export {};

package/lib/area/demo/index.js

@@ -1,47 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-var _a;
-Object.defineProperty(exports, "__esModule", { value: true });
-var component_1 = require("../../common/component");
-var toast_1 = __importDefault(require("../../toast/toast"));
-var db = (_a = wx.cloud) === null || _a === void 0 ? void 0 : _a.database();
-(0, component_1.SmartComponent)({
-    data: {
-        areaList: {},
-        loading: true,
-        value: 330302,
-    },
-    mounted: function () {
-        var _this = this;
-        db === null || db === void 0 ? void 0 : db.collection('region').limit(1).get().then(function (res) {
-            if (res.data && res.data.length > 0) {
-                _this.setData({
-                    loading: false,
-                    areaList: res.data[0],
-                });
-            }
-        }).catch(function (err) {
-            console.log(err);
-            _this.setData({
-                loading: false,
-            });
-        });
-    },
-    methods: {
-        onChange: function (event) {
-            var values = event.detail.values;
-            (0, toast_1.default)({
-                context: this,
-                message: values.map(function (item) { return item.name; }).join('-'),
-            });
-        },
-        onConfirm: function (event) {
-            console.log(event);
-        },
-        onCancel: function (event) {
-            console.log(event);
-        },
-    },
-});

package/lib/battery/demo/index.d.ts

@@ -1 +0,0 @@
-export {};

package/lib/battery/demo/index.js

@@ -1,4 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var component_1 = require("../../common/component");
-(0, component_1.SmartComponent)({});

package/lib/bottom-sheet/demo/index.d.ts

@@ -1 +0,0 @@
-export {};

package/lib/bottom-sheet/demo/index.js

@@ -1,27 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var component_1 = require("../../common/component");
-(0, component_1.SmartComponent)({
-    data: {
-        show1: false,
-        show2: false,
-        show3: false,
-    },
-    methods: {
-        toggle: function (type) {
-            var _a;
-            this.setData((_a = {},
-                _a[type] = !this.data[type],
-                _a));
-        },
-        toggleActionSheet1: function () {
-            this.toggle('show1');
-        },
-        toggleActionSheet2: function () {
-            this.toggle('show2');
-        },
-        toggleActionSheet3: function () {
-            this.toggle('show3');
-        },
-    },
-});

package/lib/button/demo/index.d.ts

@@ -1 +0,0 @@
-export {};

package/lib/button/demo/index.js

@@ -1,14 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var PlusCircle_1 = __importDefault(require("@tuya-miniapp/icons/dist/svg/PlusCircle"));
-var Right_1 = __importDefault(require("@tuya-miniapp/icons/dist/svg/Right"));
-var component_1 = require("../../common/component");
-(0, component_1.SmartComponent)({
-    data: {
-        iconAdd: PlusCircle_1.default,
-        iconRight: Right_1.default,
-    },
-});

package/lib/calendar/demo/index.d.ts

@@ -1 +0,0 @@
-export {};

package/lib/calendar/demo/index.js

@@ -1,110 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var component_1 = require("../../common/component");
-(0, component_1.SmartComponent)({
-    data: {
-        // day
-        curDayDate: new Date(2024, 1, 1, 0, 0, 0).getTime(),
-        minDayDate: new Date(2023, 0, 4).getTime(),
-        maxDayDate: new Date(2024, 3, 20).getTime(),
-        // weekday
-        curWeekDayDate: [new Date(2024, 0, 15).getTime(), new Date(2024, 0, 21).getTime()],
-        minWeekDayDate: new Date(2024, 0, 4).getTime(),
-        maxWeekDayDate: new Date(2024, 1, 20).getTime(),
-        // range
-        curRangeDayDate: [new Date(2024, 0, 10).getTime(), new Date(2024, 0, 20).getTime()],
-        minRangeDayDate: new Date(2024, 0, 4).getTime(),
-        maxRangeDayDate: new Date(2024, 1, 20).getTime(),
-        // month
-        curMonthDate: new Date(2024, 6, 1).getTime(),
-        minMonthDate: new Date(2024, 2, 1).getTime(),
-        maxMonthDate: new Date(2025, 9, 31).getTime(),
-        // year
-        curYearDate: new Date(2025, 0, 23).getTime(),
-        minYearDate: new Date(2024, 10, 12).getTime(),
-        maxYearDate: new Date(2029, 10, 31).getTime(),
-        // locale
-        confirmText: I18n.t('confirm'),
-        confirmDisabledText: I18n.t('confirm'),
-        firstDayOfWeek: 0,
-        locale: {
-            shortWeekDays: [
-                I18n.t('week0'),
-                I18n.t('week1'),
-                I18n.t('week2'),
-                I18n.t('week3'),
-                I18n.t('week4'),
-                I18n.t('week5'),
-                I18n.t('week6'),
-            ],
-            subFormatter: 'YYYY' + I18n.t('year') + 'MM' + I18n.t('month'),
-        },
-        locale2: {
-            subFormatter: 'YYYY' + I18n.t('year'),
-            monthsFormatter: [
-                I18n.t('cal_Jan'),
-                I18n.t('cal_Feb'),
-                I18n.t('cal_Mar'),
-                I18n.t('cal_Apr'),
-                I18n.t('cal_May'),
-                I18n.t('cal_Jun'),
-                I18n.t('cal_Jul'),
-                I18n.t('cal_Aug'),
-                I18n.t('cal_Sept'),
-                I18n.t('cal_Oct'),
-                I18n.t('cal_Nov'),
-                I18n.t('cal_Dec'),
-            ],
-        },
-        showDayPicker: false,
-        dayClassMap: {
-            '2024-01-17': 'calendar-disabled',
-        },
-        type: 'single',
-    },
-    methods: {
-        setCurDay: function (event) {
-            var date = event.detail;
-            this.setData({
-                curDayDate: new Date(date).getTime(),
-                showDayPicker: false,
-            });
-        },
-        setWeekCurDay: function (event) {
-            var date = event.detail;
-            this.setData({
-                curWeekDayDate: [date[0], date[1]],
-            });
-        },
-        setRangeCurDay: function (event) {
-            var date = event.detail;
-            this.setData({
-                curRangeDayDate: [date[0], date[1]],
-            });
-        },
-        setCurMonth: function (event) {
-            var date = event.detail;
-            this.setData({
-                curMonthDate: date,
-            });
-        },
-        setCurYear: function (event) {
-            var date = event.detail;
-            this.setData({
-                curYearDate: date,
-            });
-        },
-        onShowDayPicker: function () {
-            this.setData({
-                showDayPicker: !this.data.showDayPicker,
-            });
-        },
-        selectDate: function (e) { },
-        changeType: function (e) {
-            var _a, _b;
-            this.setData({
-                type: (_b = (_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.dataset) === null || _b === void 0 ? void 0 : _b.type,
-            });
-        },
-    },
-});

package/lib/cascader/demo/index.d.ts

@@ -1 +0,0 @@
-export {};