@tuya-miniapp/smart-ui 2.3.8-beta-5 → 2.3.8

package/example/dist/area/index.js

@@ -1,219 +0,0 @@
-import { SmartComponent } from '../common/component';
-import { pickerProps } from '../picker/shared';
-import { requestAnimationFrame } from '../common/utils';
-const EMPTY_CODE = '000000';
-SmartComponent({
-    classes: ['active-class', 'toolbar-class', 'column-class'],
-    props: Object.assign(Object.assign({}, pickerProps), { showToolbar: {
-            type: Boolean,
-            value: true,
-        }, value: {
-            type: String,
-            observer(value) {
-                this.code = value;
-                this.setValues();
-            },
-        }, areaList: {
-            type: Object,
-            value: {},
-            observer: 'setValues',
-        }, columnsNum: {
-            type: null,
-            value: 3,
-        }, columnsPlaceholder: {
-            type: Array,
-            observer(val) {
-                this.setData({
-                    typeToColumnsPlaceholder: {
-                        province: val[0] || '',
-                        city: val[1] || '',
-                        county: val[2] || '',
-                    },
-                });
-            },
-        } }),
-    data: {
-        columns: [{ values: [] }, { values: [] }, { values: [] }],
-        typeToColumnsPlaceholder: {},
-    },
-    mounted() {
-        requestAnimationFrame(() => {
-            this.setValues();
-        });
-    },
-    methods: {
-        getPicker() {
-            if (this.picker == null) {
-                this.picker = this.selectComponent('.smart-area__picker');
-            }
-            return this.picker;
-        },
-        onCancel(event) {
-            this.emit('cancel', event.detail);
-        },
-        onConfirm(event) {
-            const { index } = event.detail;
-            let { value } = event.detail;
-            value = this.parseValues(value);
-            this.emit('confirm', { value, index });
-        },
-        emit(type, detail) {
-            detail.values = detail.value;
-            delete detail.value;
-            this.$emit(type, detail);
-        },
-        parseValues(values) {
-            const { columnsPlaceholder } = this.data;
-            return values.map((value, index) => {
-                if (value && (!value.code || value.name === columnsPlaceholder[index])) {
-                    return Object.assign(Object.assign({}, value), { code: '', name: '' });
-                }
-                return value;
-            });
-        },
-        onChange(event) {
-            var _a;
-            const { index, picker, value } = event.detail;
-            this.code = value[index].code;
-            (_a = this.setValues()) === null || _a === void 0 ? void 0 : _a.then(() => {
-                this.$emit('change', {
-                    picker,
-                    values: this.parseValues(picker.getValues()),
-                    index,
-                });
-            });
-        },
-        getConfig(type) {
-            const { areaList } = this.data;
-            return (areaList && areaList[`${type}_list`]) || {};
-        },
-        getList(type, code) {
-            if (type !== 'province' && !code) {
-                return [];
-            }
-            const { typeToColumnsPlaceholder } = this.data;
-            const list = this.getConfig(type);
-            let result = Object.keys(list).map(code => ({
-                code,
-                name: list[code],
-            }));
-            if (code != null) {
-                // oversea code
-                if (code[0] === '9' && type === 'city') {
-                    code = '9';
-                }
-                result = result.filter(item => item.code.indexOf(code) === 0);
-            }
-            if (typeToColumnsPlaceholder[type] && result.length) {
-                // set columns placeholder
-                const codeFill = type === 'province'
-                    ? ''
-                    : type === 'city'
-                        ? EMPTY_CODE.slice(2, 4)
-                        : EMPTY_CODE.slice(4, 6);
-                result.unshift({
-                    code: `${code}${codeFill}`,
-                    name: typeToColumnsPlaceholder[type],
-                });
-            }
-            return result;
-        },
-        getIndex(type, code) {
-            let compareNum = type === 'province' ? 2 : type === 'city' ? 4 : 6;
-            const list = this.getList(type, code.slice(0, compareNum - 2));
-            // oversea code
-            if (code[0] === '9' && type === 'province') {
-                compareNum = 1;
-            }
-            code = code.slice(0, compareNum);
-            for (let i = 0; i < list.length; i++) {
-                if (list[i].code.slice(0, compareNum) === code) {
-                    return i;
-                }
-            }
-            return 0;
-        },
-        setValues() {
-            const picker = this.getPicker();
-            if (!picker) {
-                return;
-            }
-            let code = this.code || this.getDefaultCode();
-            const provinceList = this.getList('province');
-            const cityList = this.getList('city', code.slice(0, 2));
-            const stack = [];
-            const indexes = [];
-            const { columnsNum } = this.data;
-            if (columnsNum >= 1) {
-                stack.push(picker.setColumnValues(0, provinceList, false));
-                indexes.push(this.getIndex('province', code));
-            }
-            if (columnsNum >= 2) {
-                stack.push(picker.setColumnValues(1, cityList, false));
-                indexes.push(this.getIndex('city', code));
-                if (cityList.length && code.slice(2, 4) === '00') {
-                    [{ code }] = cityList;
-                }
-            }
-            if (columnsNum === 3) {
-                stack.push(picker.setColumnValues(2, this.getList('county', code.slice(0, 4)), false));
-                indexes.push(this.getIndex('county', code));
-            }
-            return Promise.all(stack)
-                .catch(() => { })
-                .then(() => picker.setIndexes(indexes))
-                .catch(() => { });
-        },
-        getDefaultCode() {
-            const { columnsPlaceholder } = this.data;
-            if (columnsPlaceholder.length) {
-                return EMPTY_CODE;
-            }
-            const countyCodes = Object.keys(this.getConfig('county'));
-            if (countyCodes[0]) {
-                return countyCodes[0];
-            }
-            const cityCodes = Object.keys(this.getConfig('city'));
-            if (cityCodes[0]) {
-                return cityCodes[0];
-            }
-            return '';
-        },
-        getValues() {
-            const picker = this.getPicker();
-            if (!picker) {
-                return [];
-            }
-            return this.parseValues(picker.getValues().filter(value => !!value));
-        },
-        getDetail() {
-            const values = this.getValues();
-            const area = {
-                code: '',
-                country: '',
-                province: '',
-                city: '',
-                county: '',
-            };
-            if (!values.length) {
-                return area;
-            }
-            const names = values.map((item) => item.name);
-            area.code = values[values.length - 1].code;
-            if (area.code[0] === '9') {
-                area.country = names[1] || '';
-                area.province = names[2] || '';
-            }
-            else {
-                area.province = names[0] || '';
-                area.city = names[1] || '';
-                area.county = names[2] || '';
-            }
-            return area;
-        },
-        reset(code) {
-            this.code = code || '';
-            return this.setValues();
-        },
-    },
-});

package/example/dist/area/index.json

@@ -1,6 +0,0 @@
-{
-  "component": true,
-  "usingComponents": {
-    "smart-picker": "../picker/index"
-  }
-}

package/example/dist/area/index.wxml

@@ -1,20 +0,0 @@
-<wxs src="./index.wxs" module="computed" />
-
-<smart-picker
-  class="smart-area__picker"
-  active-class="active-class"
-  toolbar-class="toolbar-class"
-  column-class="column-class"
-  show-toolbar="{{ showToolbar }}"
-  value-key="name"
-  title="{{ title }}"
-  loading="{{ loading }}"
-  columns="{{ computed.displayColumns(columns, columnsNum) }}"
-  item-height="{{ itemHeight }}"
-  visible-item-count="{{ visibleItemCount }}"
-  cancel-button-text="{{ cancelButtonText }}"
-  confirm-button-text="{{ confirmButtonText }}"
-  bind:change="onChange"
-  bind:confirm="onConfirm"
-  bind:cancel="onCancel"
-/>

package/example/dist/area/index.wxs

@@ -1,8 +0,0 @@
-/* eslint-disable */
-function displayColumns(columns, columnsNum) {
-  return columns.slice(0, +columnsNum);
-}
-
-module.exports = {
-  displayColumns: displayColumns,
-};

package/example/dist/area/index.wxss

@@ -1 +0,0 @@
-@import '../common/index.wxss';

package/example/dist/battery/demo/index.css

@@ -1 +0,0 @@
-@import '../../common/index.css';.line{display:flex;flex-direction:row;justify-content:space-between;padding:2px 20px}

package/example/dist/battery/demo/index.d.ts

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

package/example/dist/battery/demo/index.js

@@ -1,2 +0,0 @@
-import { SmartComponent } from '../../common/component';
-SmartComponent({});

package/example/dist/battery/demo/index.json

@@ -1,7 +0,0 @@
-{
-  "component": true,
-  "usingComponents": {
-    "battery": "../../battery/index",
-    "demo-block": "../../../components/demo-block/index"
-  }
-}

package/example/dist/battery/demo/index.wxml

@@ -1,18 +0,0 @@
-<demo-block title="{{I18n.t('basicUsage')}}">
-  <view class="line">
-    <battery size="20" value="100" />
-    <battery />
-    <battery value="10" />
-    <battery value="3" />
-    <battery value="0" />
-  </view>
-</demo-block>
-<demo-block title="{{I18n.t('level')}}">
-  <view class="line">
-    <battery type="horizontal" value="100" />
-    <battery type="horizontal" />
-    <battery type="horizontal" value="10" />
-    <battery type="horizontal" value="3" />
-    <battery type="horizontal" value="0" />
-  </view>
-</demo-block>

package/example/dist/battery/demo/index.wxss

@@ -1 +0,0 @@
-@import '../../common/index.wxss';.line{display:flex;flex-direction:row;justify-content:space-between;padding:2px 20px}

package/example/dist/battery/index.d.ts

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

package/example/dist/battery/index.js

@@ -1,106 +0,0 @@
-import { SmartComponent } from '../common/component';
-const wrapBatteryD = 'M6.5,0 C6.77614237,-5.07265313e-17 7,0.223857625 7,0.5 L7,1 L9.5,1 C10.3284271,1 11,1.67157288 11,2.5 L11,17.5 C11,18.3284271 10.3284271,19 9.5,19 L1.5,19 C0.671572875,19 0,18.3284271 0,17.5 L0,2.5 C0,1.67157288 0.671572875,1 1.5,1 L4,1 L4,0.5 C4,0.223857625 4.22385763,5.07265313e-17 4.5,0 L6.5,0 Z M9.5,2 L1.5,2 C1.22385763,2 1,2.22385763 1,2.5 L1,17.5 C1,17.7761424 1.22385763,18 1.5,18 L9.5,18 C9.77614237,18 10,17.7761424 10,17.5 L10,2.5 C10,2.22385763 9.77614237,2 9.5,2 Z';
-SmartComponent({
-    props: {
-        type: {
-            type: String,
-            value: 'vertical',
-        },
-        size: {
-            type: Number,
-            value: 10,
-        },
-        value: {
-            type: Number,
-            observer: 'init',
-            value: 70,
-        },
-        highColor: {
-            type: String,
-            value: '#70CF98',
-        },
-        middleColor: {
-            type: String,
-            value: '#F5A623',
-        },
-        lowColor: {
-            type: String,
-            value: '#FF4444',
-        },
-        backgroundColor: String,
-        onCalcColor: null,
-    },
-    data: {
-        svgUrl: '',
-    },
-    created() {
-        this.init();
-    },
-    methods: {
-        init() {
-            const bgColor = this.getBgColor();
-            let IValue = this.data.value;
-            if (IValue > 100) {
-                IValue = 100;
-            }
-            else if (IValue < 0) {
-                IValue = 0;
-            }
-            const top = 17 - ((17 - 3) * IValue) / 100;
-            // 左上、右上、右下、左下
-            const points = `2 ${top} 9 ${top} 9 17 2 17`;
-            const insideColor = this.calcColor(top);
-            const svgNode = `<svg
-        width="${1.1 * this.data.size}px"
-        height="${1.9 * this.data.size}px"
-        viewBox="0 0 11 19"
-      >
-        <path d='${wrapBatteryD}' fill='${this.data.backgroundColor || bgColor}' />
-        <polygon points='${points}' fill='${insideColor}' />
-      </svg>`;
-            this.setData({
-                svgUrl: this.toSvgCssBackground(svgNode),
-            });
-        },
-        getBgColor() {
-            const WX = wx;
-            const bgColor = WX.getThemeInfo();
-            if (bgColor && bgColor['--app-B1-N3']) {
-                return bgColor['--app-B1-N3'];
-            }
-            const d = wx.getSystemInfoSync();
-            if (d && d.theme === 'light') {
-                return '#fff';
-            }
-            return 'rgba(0, 0, 0, 0.5)';
-        },
-        calcColor(top) {
-            // 自定义电量的颜色分配规则
-            const color = typeof this.data.onCalcColor === 'function' && this.data.onCalcColor();
-            if (color) {
-                return color;
-            }
-            if (top <= 14.2 && top >= 3) {
-                return this.data.highColor;
-            }
-            if (top <= 15.6 && top > 14.2) {
-                return this.data.middleColor;
-            }
-            return this.data.lowColor;
-        },
-        toSvgCssBackground(svgString) {
-            let res = svgString;
-            res = svgString
-                .replace('<svg', ~svgString.indexOf('xmlns') ? '<svg' : '<svg xmlns="http://www.w3.org/2000/svg"')
-                .replace(/"/g, "'")
-                .replace(/%/g, '%25')
-                .replace(/#/g, '%23')
-                .replace(/{/g, '%7B')
-                .replace(/}/g, '%7D')
-                .replace(/</g, '%3C')
-                .replace(/>/g, '%3E')
-                .replace(/\s+/g, ' ');
-            return `background-image: url("data:image/svg+xml,${res}"); width: ${1.1 * this.data.size}px; height: ${1.9 * this.data.size}px; background-repeat: no-repeat; transform: ${this.data.type === 'horizontal' ? 'rotate(90deg)' : '0'}`;
-        },
-    },
-});

package/example/dist/battery/index.json

@@ -1,4 +0,0 @@
-{
-  "component": true,
-  "usingComponents": {}
-}

package/example/dist/battery/index.wxml

@@ -1 +0,0 @@
-<view style="{{svgUrl}}"></view>

package/example/dist/bottom-sheet/demo/index.css

@@ -1 +0,0 @@
-@import '../../common/index.css';.content{background:var(--app-B1,#f6f7fb);color:var(--app-B4-N1,#3d3d3d);display:flex;font-size:20px;justify-content:center}.footer{margin:16px 0}.demo-header{padding:10px 39px}.demo-text{font-size:40px;font-weight:600;line-height:46px}.demo-slider{margin:23px 0;min-height:45px}

package/example/dist/bottom-sheet/demo/index.d.ts

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

package/example/dist/bottom-sheet/demo/index.js

@@ -1,24 +0,0 @@
-import { SmartComponent } from '../../common/component';
-SmartComponent({
-    data: {
-        show1: false,
-        show2: false,
-        show3: false,
-    },
-    methods: {
-        toggle(type) {
-            this.setData({
-                [type]: !this.data[type],
-            });
-        },
-        toggleActionSheet1() {
-            this.toggle('show1');
-        },
-        toggleActionSheet2() {
-            this.toggle('show2');
-        },
-        toggleActionSheet3() {
-            this.toggle('show3');
-        },
-    },
-});

package/example/dist/bottom-sheet/demo/index.json

@@ -1,8 +0,0 @@
-{
-  "component": true,
-  "usingComponents": {
-    "smart-button": "../../button/index",
-    "smart-bottom-sheet": "../../bottom-sheet/index",
-    "demo-block": "../../../components/demo-block/index"
-  }
-}

package/example/dist/bottom-sheet/demo/index.wxml

@@ -1,37 +0,0 @@
-<demo-block title="{{I18n.t('basicUsage')}}" padding>
-  <smart-button type="primary" bind:click="toggleActionSheet1">{{I18n.t('popupMenu')}}</smart-button>
-  <smart-bottom-sheet
-    title="Title"
-    show="{{ show1 }}"
-    bind:close="toggleActionSheet1"
-  />
-</demo-block>
-
-<demo-block title="{{I18n.t('customize')}}" padding>
-  <smart-button type="primary" bind:click="toggleActionSheet2">{{I18n.t('popupMenu')}}</smart-button>
-  <smart-bottom-sheet
-    show="{{ show2 }}"
-    title="Title"
-    bind:close="toggleActionSheet2"
-  >
-    <view class="content" />
-    <view class="footer">
-      <smart-button type="info" block>{{I18n.t('complete')}}</smart-button>
-    </view>
-  </smart-bottom-sheet>
-</demo-block>
-
-<demo-block title="{{I18n.t('maxHeight')}}" padding>
-  <smart-button type="primary" bind:click="toggleActionSheet3">{{I18n.t('popupMenu')}}</smart-button>
-  <smart-bottom-sheet
-    show="{{ show3 }}"
-    title="Title"
-    bind:close="toggleActionSheet3"
-  >
-    <view style="background-color: red; height: 100px;" />
-    <view style="background-color: blue; height: 100px;" />
-    <view style="background-color: black; height: 100px;" />
-    <view style="background-color: yellow; height: 100px;" />
-    <view style="background-color: pink; height: 100px;" />
-  </smart-bottom-sheet>
-</demo-block>

package/example/dist/bottom-sheet/demo/index.wxss

@@ -1 +0,0 @@
-@import '../../common/index.wxss';.content{background:var(--app-B1,#f6f7fb);color:var(--app-B4-N1,#3d3d3d);display:flex;font-size:20px;justify-content:center}.footer{margin:16px 0}.demo-header{padding:10px 39px}.demo-text{font-size:40px;font-weight:600;line-height:46px}.demo-slider{margin:23px 0;min-height:45px}

package/example/dist/bottom-sheet/index.css

@@ -1 +0,0 @@
-@import '../common/index.css';.smart-bottom-sheet{color:var(--bottom-sheet-font-color,var(--app-B4-N1,#000));display:flex;flex-direction:column;max-height:var(--bottom-sheet-max-height,50%)!important;min-height:var(--bottom-sheet-min-height,auto);padding:var(--bottom-sheet-padding,0 16px);padding-bottom:env(safe-area-inset-bottom);width:var(--bottom-sheet-width,100%)!important}.smart-bottom-sheet__header{color:var(--bottom-sheet-header-color,var(--app-B4-N1,#000));font-size:var(--bottom-sheet-header-font-size,17px);font-weight:var(--bottom-sheet-header-font-weight,600);line-height:var(--bottom-sheet-header-height,56px);text-align:center}.smart-bottom-sheet__content{overflow-y:scroll}.smart-bottom-sheet__icon{margin:var(--bottom-sheet-icon-margin,16px 16px 0 0);position:absolute;right:0;top:0}

package/example/dist/bottom-sheet/index.d.ts

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

package/example/dist/bottom-sheet/index.js

@@ -1,71 +0,0 @@
-import xmarkIcon from '@tuya-miniapp/icons/dist/svg/Xmark';
-import { SmartComponent } from '../common/component';
-SmartComponent({
-    props: {
-        show: Boolean,
-        title: String,
-        iconColor: String,
-        iconSize: {
-            type: null,
-            value: 24,
-        },
-        round: {
-            type: Boolean,
-            value: true,
-        },
-        zIndex: {
-            type: Number,
-            value: 100,
-        },
-        overlay: {
-            type: Boolean,
-            value: true,
-        },
-        closeOnClickOverlay: {
-            type: Boolean,
-            value: true,
-        },
-        rootPortal: {
-            type: Boolean,
-            value: false,
-        },
-    },
-    data: {
-        xmarkIcon,
-        xmarkIconColor: 'rgba(0, 0, 0, 0.5)',
-    },
-    mounted() {
-        var _a;
-        // @ts-ignore
-        const themeInfo = (_a = ty === null || ty === void 0 ? void 0 : ty.getThemeInfo()) !== null && _a !== void 0 ? _a : {};
-        const xmarkIconColor = this.data.iconColor || themeInfo['--app-B4-N3'] || 'rgba(0, 0, 0, 0.5)';
-        this.setData({ xmarkIconColor });
-    },
-    methods: {
-        onClose() {
-            this.$emit('close');
-        },
-        onClickOverlay() {
-            this.$emit('click-overlay');
-            this.onClose();
-        },
-        onBeforeEnter() {
-            this.$emit('before-enter');
-        },
-        onEnter() {
-            this.$emit('enter');
-        },
-        onAfterEnter() {
-            this.$emit('after-enter');
-        },
-        onBeforeLeave() {
-            this.$emit('before-leave');
-        },
-        onLeave() {
-            this.$emit('leave');
-        },
-        onAfterLeave() {
-            this.$emit('after-leave');
-        },
-    },
-});

package/example/dist/bottom-sheet/index.json

@@ -1,8 +0,0 @@
-{
-  "component": true,
-  "usingComponents": {
-    "smart-icon": "../icon/index",
-    "smart-popup": "../popup/index",
-    "smart-loading": "../loading/index"
-  }
-}

package/example/dist/bottom-sheet/index.wxml

@@ -1,28 +0,0 @@
-<wxs src="../wxs/utils.wxs" module="utils" />
-
-<smart-popup
-  show="{{ show }}"
-  position="bottom"
-  round="{{ round }}"
-  z-index="{{ zIndex }}"
-  overlay="{{ overlay }}"
-  custom-class="smart-bottom-sheet custom-class"
-  safe-area-inset-bottom="{{false}}"
-  close-on-click-overlay="{{ closeOnClickOverlay }}"
-  root-portal="{{ rootPortal }}"
-  bind:close="onClickOverlay"
-  bind:before-enter="onBeforeEnter"
-  bind:enter="onEnter"
-  bind:after-enter="onAfterEnter"
-  bind:before-leave="onBeforeLeave"
-  bind:leave="onLeave"
-  bind:after-leave="onAfterLeave"
->
-  <view wx:if="{{ title }}" class="smart-bottom-sheet__header">
-    {{ title }}
-    <smart-icon bind:click="onClose" name="{{ xmarkIcon }}" class="smart-bottom-sheet__icon" size="{{ iconSize }}" color="{{ xmarkIconColor }}" />
-  </view>
-  <view class="smart-bottom-sheet__content">
-    <slot />
-  </view>
-</smart-popup>

package/example/dist/bottom-sheet/index.wxss

@@ -1 +0,0 @@
-@import '../common/index.wxss';.smart-bottom-sheet{color:var(--bottom-sheet-font-color,var(--app-B4-N1,#000));display:flex;flex-direction:column;max-height:var(--bottom-sheet-max-height,50%)!important;min-height:var(--bottom-sheet-min-height,auto);padding:var(--bottom-sheet-padding,0 16px);padding-bottom:env(safe-area-inset-bottom);width:var(--bottom-sheet-width,100%)!important}.smart-bottom-sheet__header{color:var(--bottom-sheet-header-color,var(--app-B4-N1,#000));font-size:var(--bottom-sheet-header-font-size,17px);font-weight:var(--bottom-sheet-header-font-weight,600);line-height:var(--bottom-sheet-header-height,56px);text-align:center}.smart-bottom-sheet__content{overflow-y:scroll}.smart-bottom-sheet__icon{margin:var(--bottom-sheet-icon-margin,16px 16px 0 0);position:absolute;right:0;top:0}

package/example/dist/button/demo/index.css

@@ -1 +0,0 @@
-@import '../../common/index.css';.row{margin-bottom:15px}.demo-margin-left{margin-left:10px}.demo-margin-right{margin-right:10px}.demo-margin-bottom{display:block;margin-bottom:15px}.demo-margin-top{display:block;margin-top:15px}.w-full{width:100%}

package/example/dist/button/demo/index.d.ts

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

package/example/dist/button/demo/index.js

@@ -1,9 +0,0 @@
-import iconAdd from '@tuya-miniapp/icons/dist/svg/PlusCircle';
-import iconRight from '@tuya-miniapp/icons/dist/svg/Right';
-import { SmartComponent } from '../../common/component';
-SmartComponent({
-    data: {
-        iconAdd,
-        iconRight,
-    },
-});

package/example/dist/button/demo/index.json

@@ -1,9 +0,0 @@
-{
-  "component": true,
-  "usingComponents": {
-    "smart-button": "../../button/index",
-    "smart-row": "../../row/index",
-    "smart-col": "../../col/index",
-    "demo-block": "../../../components/demo-block/index"
-  }
-}