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

package/example/dist/index-bar/index.js

@@ -0,0 +1,247 @@
+import { GREEN } from '../common/color';
+import { SmartComponent } from '../common/component';
+import { useChildren } from '../common/relation';
+import { getRect, isDef } from '../common/utils';
+import { pageScrollMixin } from '../mixins/page-scroll';
+const indexList = () => {
+    const indexList = [];
+    const charCodeOfA = 'A'.charCodeAt(0);
+    for (let i = 0; i < 26; i++) {
+        indexList.push(String.fromCharCode(charCodeOfA + i));
+    }
+    return indexList;
+};
+SmartComponent({
+    relation: useChildren('index-anchor', function () {
+        this.updateData();
+    }),
+    props: {
+        scrollable: {
+            type: Boolean,
+            value: false,
+        },
+        sticky: {
+            type: Boolean,
+            value: true,
+        },
+        zIndex: {
+            type: Number,
+            value: 1,
+        },
+        highlightColor: {
+            type: String,
+            value: GREEN,
+        },
+        stickyOffsetTop: {
+            type: Number,
+            value: 0,
+        },
+        indexList: {
+            type: Array,
+            value: indexList(),
+        },
+    },
+    mixins: [
+        pageScrollMixin(function (event) {
+            this.scrollTop = (event === null || event === void 0 ? void 0 : event.scrollTop) || 0;
+            this.onScroll();
+        }),
+    ],
+    data: {
+        activeAnchorIndex: null,
+        showSidebar: false,
+    },
+    created() {
+        this.scrollTop = 0;
+    },
+    methods: {
+        updateData() {
+            wx.nextTick(() => {
+                if (this.timer != null) {
+                    clearTimeout(this.timer);
+                }
+                this.timer = setTimeout(() => {
+                    this.setData({
+                        showSidebar: !!this.children.length,
+                    });
+                    this.setRect().then(() => {
+                        this.onScroll();
+                    });
+                }, 0);
+            });
+        },
+        setRect() {
+            return Promise.all([this.setAnchorsRect(), this.setListRect(), this.setSiderbarRect()]);
+        },
+        setAnchorsRect() {
+            return Promise.all(this.children.map(anchor => getRect(anchor, '.smart-index-anchor-wrapper').then(rect => {
+                Object.assign(anchor, {
+                    height: rect.height,
+                    top: rect.top + this.scrollTop,
+                });
+            })));
+        },
+        setListRect() {
+            return getRect(this, '.smart-index-bar').then(rect => {
+                if (!isDef(rect)) {
+                    return;
+                }
+                Object.assign(this, {
+                    height: rect.height,
+                    top: rect.top + this.scrollTop,
+                });
+            });
+        },
+        setSiderbarRect() {
+            return getRect(this, '.smart-index-bar__sidebar').then(res => {
+                if (!isDef(res)) {
+                    return;
+                }
+                this.sidebar = {
+                    height: res.height,
+                    top: res.top,
+                };
+            });
+        },
+        setDiffData({ target, data }) {
+            const diffData = {};
+            Object.keys(data).forEach(key => {
+                if (target.data[key] !== data[key]) {
+                    diffData[key] = data[key];
+                }
+            });
+            if (Object.keys(diffData).length) {
+                target.setData(diffData);
+            }
+        },
+        getAnchorRect(anchor) {
+            return getRect(anchor, '.smart-index-anchor-wrapper').then(rect => ({
+                height: rect.height,
+                top: rect.top,
+            }));
+        },
+        getActiveAnchorIndex() {
+            const { children, scrollTop } = this;
+            const { sticky, stickyOffsetTop } = this.data;
+            for (let i = this.children.length - 1; i >= 0; i--) {
+                const preAnchorHeight = i > 0 ? children[i - 1].height : 0;
+                const reachTop = sticky ? preAnchorHeight + stickyOffsetTop : 0;
+                if (reachTop + scrollTop >= children[i].top) {
+                    return i;
+                }
+            }
+            return -1;
+        },
+        onScroll() {
+            const { children = [], scrollTop } = this;
+            if (!children.length) {
+                return;
+            }
+            const { sticky, stickyOffsetTop, zIndex, highlightColor } = this.data;
+            const active = this.getActiveAnchorIndex();
+            this.setDiffData({
+                target: this,
+                data: {
+                    activeAnchorIndex: active,
+                },
+            });
+            if (sticky) {
+                let isActiveAnchorSticky = false;
+                if (active !== -1) {
+                    isActiveAnchorSticky = children[active].top <= stickyOffsetTop + scrollTop;
+                }
+                children.forEach((item, index) => {
+                    if (index === active) {
+                        let wrapperStyle = '';
+                        let anchorStyle = `
+              color: ${highlightColor};
+            `;
+                        if (isActiveAnchorSticky) {
+                            wrapperStyle = `
+                height: ${children[index].height}px;
+              `;
+                            anchorStyle = `
+                position: fixed;
+                top: ${stickyOffsetTop}px;
+                z-index: ${zIndex};
+                color: ${highlightColor};
+              `;
+                        }
+                        this.setDiffData({
+                            target: item,
+                            data: {
+                                active: true,
+                                anchorStyle,
+                                wrapperStyle,
+                            },
+                        });
+                    }
+                    else if (index === active - 1) {
+                        const currentAnchor = children[index];
+                        const currentOffsetTop = currentAnchor.top;
+                        const targetOffsetTop = index === children.length - 1 ? this.top : children[index + 1].top;
+                        const parentOffsetHeight = targetOffsetTop - currentOffsetTop;
+                        const translateY = parentOffsetHeight - currentAnchor.height;
+                        const anchorStyle = `
+              position: relative;
+              transform: translate3d(0, ${translateY}px, 0);
+              z-index: ${zIndex};
+              color: ${highlightColor};
+            `;
+                        this.setDiffData({
+                            target: item,
+                            data: {
+                                active: true,
+                                anchorStyle,
+                            },
+                        });
+                    }
+                    else {
+                        this.setDiffData({
+                            target: item,
+                            data: {
+                                active: false,
+                                anchorStyle: '',
+                                wrapperStyle: '',
+                            },
+                        });
+                    }
+                });
+            }
+        },
+        onClick(event) {
+            this.scrollToAnchor(event.target.dataset.index);
+        },
+        onTouchMove(event) {
+            if (!this.data.scrollable)
+                return;
+            const sidebarLength = this.children.length;
+            const touch = event.touches[0];
+            const itemHeight = this.sidebar.height / sidebarLength;
+            let index = Math.floor((touch.clientY - this.sidebar.top) / itemHeight);
+            if (index < 0) {
+                index = 0;
+            }
+            else if (index > sidebarLength - 1) {
+                index = sidebarLength - 1;
+            }
+            this.scrollToAnchor(index);
+        },
+        onTouchStop() {
+            if (!this.data.scrollable)
+                return;
+            this.scrollToAnchorIndex = null;
+        },
+        scrollToAnchor(index) {
+            if (typeof index !== 'number' || this.scrollToAnchorIndex === index) {
+                return;
+            }
+            this.scrollToAnchorIndex = index;
+            const anchor = this.children.find(item => item.data.index === this.data.indexList[index]);
+            if (anchor) {
+                anchor.scrollIntoView(this.scrollTop);
+                this.$emit('select', anchor.data.index);
+            }
+        },
+    },
+});

package/example/dist/index-bar/index.json

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

package/example/dist/index-bar/index.wxml

@@ -0,0 +1,22 @@
+<view class="smart-index-bar">
+  <slot />
+
+  <view
+    wx:if="{{ showSidebar }}"
+    class="smart-index-bar__sidebar"
+    catch:tap="onClick"
+    catch:touchmove="onTouchMove"
+    catch:touchend="onTouchStop"
+    catch:touchcancel="onTouchStop"
+  >
+    <view
+      wx:for="{{ indexList }}"
+      wx:key="index"
+      class="smart-index-bar__index"
+      style="z-index: {{ zIndex + 1 }}; color: {{ activeAnchorIndex === index ? highlightColor : '' }}"
+      data-index="{{ index }}"
+    >
+      {{ item }}
+    </view>
+  </view>
+</view>

package/example/dist/index-bar/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.smart-index-bar{position:relative}.smart-index-bar__sidebar{display:flex;flex-direction:column;position:fixed;right:0;text-align:center;top:50%;transform:translateY(-50%);-webkit-user-select:none;user-select:none}.smart-index-bar__index{font-size:var(--index-bar-index-font-size,10px);font-weight:500;line-height:var(--index-bar-index-line-height,14px);padding:0 var(--padding-base,4px) 0 var(--padding-md,16px)}

package/example/dist/info/index.css

@@ -0,0 +1 @@
+@import '../common/index.css';.smart-info{align-items:center;background-color:var(--info-background-color,var(--app-M2,#f04c4c));border:var(--info-border-width,0) solid #fff;border-radius:var(--info-size,12px);box-sizing:border-box;color:var(--info-color,#fff);display:inline-flex;font-family:var(--info-font-family,-apple-system-font,PingFang SC,Helvetica Neue,Arial,sans-serif);font-size:var(--info-font-size,11px);font-weight:var(--info-font-weight,600);height:var(--info-size,12px);justify-content:center;min-width:var(--info-size,12px);padding:var(--info-padding,0 4px);position:absolute;right:0;top:0;transform:translate(50%,-50%);transform-origin:100%;white-space:nowrap}.smart-info--dot{background-color:var(--info-dot-color,var(--app-M2,#f04c4c));border-radius:100%;height:var(--info-dot-size,8px);min-width:0;width:var(--info-dot-size,8px)}

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

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

package/example/dist/info/index.js

@@ -0,0 +1,8 @@
+import { SmartComponent } from '../common/component';
+SmartComponent({
+    props: {
+        dot: Boolean,
+        info: null,
+        customStyle: String,
+    },
+});

package/example/dist/info/index.json

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

package/example/dist/info/index.wxml

@@ -0,0 +1,7 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+
+<view
+  wx:if="{{ info !== null && info !== '' || dot }}"
+  class="smart-info {{ utils.bem('info', { dot }) }} custom-class"
+  style="{{ customStyle }}"
+>{{ dot ? '' : info }}</view>

package/example/dist/info/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.smart-info{align-items:center;background-color:var(--info-background-color,var(--app-M2,#f04c4c));border:var(--info-border-width,0) solid #fff;border-radius:var(--info-size,12px);box-sizing:border-box;color:var(--info-color,#fff);display:inline-flex;font-family:var(--info-font-family,-apple-system-font,PingFang SC,Helvetica Neue,Arial,sans-serif);font-size:var(--info-font-size,11px);font-weight:var(--info-font-weight,600);height:var(--info-size,12px);justify-content:center;min-width:var(--info-size,12px);padding:var(--info-padding,0 4px);position:absolute;right:0;top:0;transform:translate(50%,-50%);transform-origin:100%;white-space:nowrap}.smart-info--dot{background-color:var(--info-dot-color,var(--app-M2,#f04c4c));border-radius:100%;height:var(--info-dot-size,8px);min-width:0;width:var(--info-dot-size,8px)}

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

@@ -0,0 +1 @@
+@import '../../common/index.css';.demo-loading{margin:4px 16px 4px 0}

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

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

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

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

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

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

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

@@ -0,0 +1,19 @@
+<demo-block title="{{I18n.t('loadingType')}}" padding>
+  <smart-loading custom-class="demo-loading" />
+  <smart-loading custom-class="demo-loading" type="spinner" />
+</demo-block>
+
+<demo-block title="{{I18n.t('customColor')}}" padding>
+  <smart-loading custom-class="demo-loading" type="spinner" color="#1989fa" />
+  <smart-loading custom-class="demo-loading" color="#1989fa" />
+</demo-block>
+
+<demo-block title="{{I18n.t('loadingCopy')}}" padding>
+  <smart-loading custom-class="demo-loading" type="spinner" size="24px" color="#1989FA">{{I18n.t('loading')}}...</smart-loading>
+  <smart-loading custom-class="demo-loading" size="24px" color="#1989FA">{{I18n.t('loading')}}...</smart-loading>
+</demo-block>
+
+<demo-block title="{{I18n.t('verticalArrangement')}}" padding>
+  <smart-loading type="spinner" custom-class="demo-loading" size="24px" vertical color="#1989FA">{{I18n.t('loading')}}...</smart-loading>
+
+</demo-block>

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

@@ -0,0 +1 @@
+@import '../../common/index.wxss';.demo-loading{margin:4px 16px 4px 0}

package/example/dist/loading/index.css

@@ -0,0 +1 @@
+@import '../common/index.css';:host{font-size:0;line-height:1}.smart-loading{align-items:center;color:var(--loading-spinner-color,#c8c9cc);display:inline-flex;justify-content:center}.smart-loading__spinner{animation:smart-rotate var(--loading-spinner-animation-duration,.8s) linear infinite;box-sizing:border-box;height:var(--loading-spinner-size,30px);max-height:100%;max-width:100%;position:relative;width:var(--loading-spinner-size,30px)}.smart-loading__spinner--spinner{animation-timing-function:steps(8)}.smart-loading__text{color:var(--loading-text-color,#969799);font-size:var(--loading-text-font-size,14px);line-height:var(--loading-text-line-height,20px);margin-left:var(--padding-xs,8px)}.smart-loading__text:empty{display:none}.smart-loading--vertical{flex-direction:column}.smart-loading--vertical .smart-loading__text{margin:var(--padding-xs,8px) 0 0}@keyframes smart-rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}

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

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

package/example/dist/loading/index.js

@@ -0,0 +1,40 @@
+import { SmartComponent } from '../common/component';
+SmartComponent({
+    props: {
+        color: {
+            type: String,
+            value: '#1989FA'
+        },
+        vertical: Boolean,
+        type: {
+            type: String,
+            value: 'circular',
+        },
+        size: {
+            type: String,
+            value: '30',
+        },
+        textSize: String,
+    },
+    data: {
+        spinner: '',
+        circular: ''
+    },
+    created() {
+        this.setData({
+            spinner: this.SpinnerLoading({ color: this.data.color }),
+            circular: this.CircularLoading({ color: this.data.color })
+        });
+    },
+    methods: {
+        createSvgIcon(svg) {
+            return `data:image/svg+xml,${encodeURIComponent(`<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">${svg}`)}`;
+        },
+        CircularLoading({ color = '#1989FA' }) {
+            return this.createSvgIcon(`<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="24" height="24" viewBox="0 0 24 24"><defs><clipPath id="master_svg0_452_31565"><rect x="0" y="0" width="24" height="24" rx="0"/></clipPath><linearGradient x1="0.5" y1="0.5" x2="0.5" y2="0.8999999761581421" id="master_svg1_452_31641"><stop offset="0%" stop-color="${color}" stop-opacity="1"/><stop offset="100%" stop-color="${color}" stop-opacity="0"/></linearGradient></defs><g clip-path="url(#master_svg0_452_31565)"><g style="opacity:0.20000000298023224;"><path d="M12,18.4C15.5346,18.4,18.4,15.5346,18.4,12C18.4,8.46538,15.5346,5.6,12,5.6C8.46538,5.6,5.6,8.46538,5.6,12C5.6,15.5346,8.46538,18.4,12,18.4ZM12,20C16.418300000000002,20,20,16.418300000000002,20,12C20,7.58172,16.418300000000002,4,12,4C7.58172,4,4,7.58172,4,12C4,16.418300000000002,7.58172,20,12,20Z" fill-rule="evenodd" fill="${color}" fill-opacity="1"/></g><g><path d="M12,5.6C8.46538,5.6,5.6,8.46538,5.6,12C5.6,15.5346,8.46538,18.4,12,18.4C12.44183,18.4,12.8,18.758200000000002,12.8,19.2C12.8,19.6418,12.44183,20,12,20C7.58172,20,4,16.418300000000002,4,12C4,7.58172,7.58172,4,12,4C16.418300000000002,4,20,7.58172,20,12C20,12.44183,19.6418,12.8,19.2,12.8C18.758200000000002,12.8,18.4,12.44183,18.4,12C18.4,8.46538,15.5346,5.6,12,5.6Z" fill-rule="evenodd" fill="url(#master_svg1_452_31641)" fill-opacity="1"/></g></g></svg>`);
+        },
+        SpinnerLoading({ color = '#3678E3' }) {
+            return this.createSvgIcon(`<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="32" height="32" viewBox="0 0 32 32"><defs><clipPath id="master_svg0_1695_29273"><rect x="0" y="0" width="32" height="32" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_1695_29273)"><g><path d="M14.73077392578125,8.807690000000001L14.73077392578125,6.26923C14.73077392578125,5.568254,15.29902692578125,5,16.00000392578125,5C16.70097392578125,5,17.26923392578125,5.568254,17.26923392578125,6.26923L17.26923392578125,8.807690000000001C17.26923392578125,9.50867,16.70097392578125,10.07693,16.00000392578125,10.07693C15.29902692578125,10.07693,14.73077392578125,9.50867,14.73077392578125,8.807690000000001Z" fill="${color}" fill-opacity="1"/></g><g transform="matrix(0.7071067690849304,0.7071067690849304,-0.7071067690849304,0.7071067690849304,11.880707750418878,-14.033822285849965)" style="opacity:0.05000000074505806;"><path d="M22.88067626953125,11.132061337890626L22.88067626953125,8.593601337890625C22.88067626953125,7.892624337890625,23.44892926953125,7.324371337890625,24.14990626953125,7.324371337890625C24.85088626953125,7.324371337890625,25.41913626953125,7.892624337890625,25.41913626953125,8.593601337890625L25.41913626953125,11.132061337890626C25.41913626953125,11.833041337890625,24.85088626953125,12.401291337890626,24.14990626953125,12.401291337890626C23.44892926953125,12.401291337890626,22.88067626953125,11.833041337890625,22.88067626953125,11.132061337890626Z" fill="${color}" fill-opacity="1"/></g><g transform="matrix(0,1,-1,0,41.73081970214844,-12.269180297851562)" style="opacity:0.10000000149011612;"><path d="M27,18.53850970214844L27,16.000049702148438C27,15.299072702148438,27.568253,14.730819702148438,28.26923,14.730819702148438C28.97021,14.730819702148438,29.53846,15.299072702148438,29.53846,16.000049702148438L29.53846,18.53850970214844C29.53846,19.23948970214844,28.97021,19.80773970214844,28.26923,19.80773970214844C27.568253,19.80773970214844,27,19.23948970214844,27,18.53850970214844Z" fill="${color}" fill-opacity="1"/></g><g transform="matrix(-0.7071067690849304,0.7071067690849304,-0.7071067690849304,-0.7071067690849304,58.30294381839121,21.611726407169044)" style="opacity:0.15000000596046448;"><path d="M24.675537109375,26.68848833984375L24.675537109375,24.15002833984375C24.675537109375,23.44905133984375,25.243790109375,22.88079833984375,25.944767109375,22.88079833984375C26.645747109375,22.88079833984375,27.213997109375,23.44905133984375,27.213997109375,24.15002833984375L27.213997109375,26.68848833984375C27.213997109375,27.389468339843752,26.645747109375,27.95771833984375,25.944767109375,27.95771833984375C25.243790109375,27.95771833984375,24.675537109375,27.389468339843752,24.675537109375,26.68848833984375Z" fill="${color}" fill-opacity="1"/></g><g transform="matrix(-1,0,0,-1,34.5384521484375,54)" style="opacity:0.30000001192092896;"><path d="M17.26922607421875,30.80769L17.26922607421875,28.26923C17.26922607421875,27.568254,17.83747907421875,27,18.53845607421875,27C19.23942607421875,27,19.80768607421875,27.568254,19.80768607421875,28.26923L19.80768607421875,30.80769C19.80768607421875,31.508670000000002,19.23942607421875,32.07693,18.53845607421875,32.07693C17.83747907421875,32.07693,17.26922607421875,31.508670000000002,17.26922607421875,30.80769Z" fill="${color}" fill-opacity="1"/></g><g transform="matrix(-0.7071068286895752,-0.7071067094802856,0.7071067094802856,-0.7071068286895752,-1.8805817391439632,48.572416538932885)" style="opacity:0.550000011920929;"><path d="M9.119384765625,28.483379697265626L9.119384765625,25.944919697265625C9.119384765625,25.243942697265624,9.687637765625,24.675689697265625,10.388614765625,24.675689697265625C11.089594765625,24.675689697265625,11.657844765625,25.243942697265624,11.657844765625,25.944919697265625L11.657844765625,28.483379697265626C11.657844765625,29.184359697265627,11.089594765625,29.752609697265626,10.388614765625,29.752609697265626C9.687637765625,29.752609697265626,9.119384765625,29.184359697265627,9.119384765625,28.483379697265626Z" fill="${color}" fill-opacity="1"/></g><g transform="matrix(0,-1,1,0,-12.269241333007812,22.269241333007812)" style="opacity:0.699999988079071;"><path d="M5,21.076931333007813L5,18.538471333007813C5,17.83749433300781,5.568253,17.269241333007812,6.26923,17.269241333007812C6.97021,17.269241333007812,7.538460000000001,17.83749433300781,7.538460000000001,18.538471333007813L7.538460000000001,21.076931333007813C7.538460000000001,21.777911333007815,6.97021,22.346161333007814,6.26923,22.346161333007814C5.568253,22.346161333007814,5,21.777911333007815,5,21.076931333007813Z" fill="${color}" fill-opacity="1"/></g><g transform="matrix(0.7071066498756409,-0.70710688829422,0.70710688829422,0.7071066498756409,-4.303046450104375,7.850115344526785)" style="opacity:0.8500000238418579;"><path d="M7.32440185546875,12.926983212890626L7.32440185546875,10.388523212890625C7.32440185546875,9.687546212890625,7.89265485546875,9.119293212890625,8.59363185546875,9.119293212890625C9.29461185546875,9.119293212890625,9.86286185546875,9.687546212890625,9.86286185546875,10.388523212890625L9.86286185546875,12.926983212890626C9.86286185546875,13.627963212890625,9.29461185546875,14.196213212890626,8.59363185546875,14.196213212890626C7.89265485546875,14.196213212890626,7.32440185546875,13.627963212890625,7.32440185546875,12.926983212890626Z" fill="${color}" fill-opacity="1"/></g></g></svg>`);
+        }
+    }
+});

package/example/dist/loading/index.json

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

package/example/dist/loading/index.wxml

@@ -0,0 +1,17 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+<wxs src="./index.wxs" module="computed" />
+
+<view class="custom-class {{ utils.bem('loading', { vertical }) }}">
+  <view
+    class="smart-loading__spinner smart-loading__spinner--{{ type }}"
+    style="{{ computed.loadingStyle({ size, type, color, spinner, circular }) }}"
+  >
+    <view
+      class="smart-switch__loading"
+      style="{{ computed.loadingStyle({ size, type, color, spinner, circular }) }}" 
+    />
+  </view>
+  <view class="smart-loading__text" style="{{ computed.textStyle({ textSize, color }) }}">
+    <slot />
+  </view>
+</view>

package/example/dist/loading/index.wxs

@@ -0,0 +1,38 @@
+/* eslint-disable */
+var style = require('../wxs/style.wxs');
+var addUnit = require('../wxs/add-unit.wxs');
+
+function textStyle(data) {
+  const ret = style({
+    'font-size': addUnit(data.textSize),
+    color: data.color,
+  });
+
+  return ret;
+}
+
+function loadingStyle(data) {
+  let iconSrc = ''
+
+  if (data.type === 'spinner') {
+    iconSrc = data.spinner
+  }
+
+  if (data.type === 'circular') {
+    iconSrc = data.circular
+  }
+
+  var ret = style({
+    'background-image': "url('".concat(iconSrc, "')"),
+    width: addUnit(data.size),
+    height: addUnit(data.size),
+    'background-size': addUnit(data.size)
+  });
+
+  return ret;
+}
+
+module.exports = {
+  textStyle: textStyle,
+  loadingStyle: loadingStyle,
+};

package/example/dist/loading/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';:host{font-size:0;line-height:1}.smart-loading{align-items:center;color:var(--loading-spinner-color,#c8c9cc);display:inline-flex;justify-content:center}.smart-loading__spinner{animation:smart-rotate var(--loading-spinner-animation-duration,.8s) linear infinite;box-sizing:border-box;height:var(--loading-spinner-size,30px);max-height:100%;max-width:100%;position:relative;width:var(--loading-spinner-size,30px)}.smart-loading__spinner--spinner{animation-timing-function:steps(8)}.smart-loading__text{color:var(--loading-text-color,#969799);font-size:var(--loading-text-font-size,14px);line-height:var(--loading-text-line-height,20px);margin-left:var(--padding-xs,8px)}.smart-loading__text:empty{display:none}.smart-loading--vertical{flex-direction:column}.smart-loading--vertical .smart-loading__text{margin:var(--padding-xs,8px) 0 0}@keyframes smart-rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}

package/example/dist/mixins/basic.d.ts

@@ -0,0 +1 @@
+export declare const basic: string;

package/example/dist/mixins/basic.js

@@ -0,0 +1,26 @@
+export const basic = Behavior({
+    methods: {
+        $emit(name, detail, options) {
+            this.triggerEvent(name, detail, options);
+        },
+        set(data) {
+            this.setData(data);
+            return new Promise(resolve => wx.nextTick(resolve));
+        },
+        // high performance setData
+        setView(data, callback) {
+            const target = {};
+            let hasChange = false;
+            Object.keys(data).forEach(key => {
+                if (data[key] !== this.data[key]) {
+                    target[key] = data[key];
+                    hasChange = true;
+                }
+            });
+            if (hasChange) {
+                return this.setData(target, callback);
+            }
+            return callback && callback();
+        },
+    },
+});

package/example/dist/mixins/button.d.ts

@@ -0,0 +1 @@
+export declare const button: string;

package/example/dist/mixins/button.js

@@ -0,0 +1,51 @@
+import { canIUseGetUserProfile } from '../common/version';
+export const button = Behavior({
+    externalClasses: ['hover-class'],
+    properties: {
+        id: String,
+        buttonId: String,
+        lang: String,
+        businessId: Number,
+        sessionFrom: String,
+        sendMessageTitle: String,
+        sendMessagePath: String,
+        sendMessageImg: String,
+        showMessageCard: Boolean,
+        appParameter: String,
+        ariaLabel: String,
+        openType: String,
+        getUserProfileDesc: String,
+    },
+    data: {
+        canIUseGetUserProfile: canIUseGetUserProfile(),
+    },
+    methods: {
+        onGetUserInfo(event) {
+            this.triggerEvent('getuserinfo', event.detail);
+        },
+        onContact(event) {
+            this.triggerEvent('contact', event.detail);
+        },
+        onGetPhoneNumber(event) {
+            this.triggerEvent('getphonenumber', event.detail);
+        },
+        onGetRealTimePhoneNumber(event) {
+            this.triggerEvent('getrealtimephonenumber', event.detail);
+        },
+        onError(event) {
+            this.triggerEvent('error', event.detail);
+        },
+        onLaunchApp(event) {
+            this.triggerEvent('launchapp', event.detail);
+        },
+        onOpenSetting(event) {
+            this.triggerEvent('opensetting', event.detail);
+        },
+        onAgreePrivacyAuthorization(event) {
+            this.triggerEvent('agreeprivacyauthorization', event.detail);
+        },
+        onChooseAvatar(event) {
+            this.triggerEvent('chooseavatar', event.detail);
+        },
+    },
+});

package/example/dist/mixins/link.d.ts

@@ -0,0 +1 @@
+export declare const link: string;

package/example/dist/mixins/link.js

@@ -0,0 +1,22 @@
+export const link = Behavior({
+    properties: {
+        url: String,
+        linkType: {
+            type: String,
+            value: 'navigateTo',
+        },
+    },
+    methods: {
+        jumpLink(urlKey = 'url') {
+            const url = this.data[urlKey];
+            if (url) {
+                if (this.data.linkType === 'navigateTo' && getCurrentPages().length > 9) {
+                    wx.redirectTo({ url });
+                }
+                else {
+                    wx[this.data.linkType]({ url });
+                }
+            }
+        },
+    },
+});

package/example/dist/mixins/page-scroll.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="miniprogram-api-typings" />
+/// <reference types="miniprogram-api-typings" />
+type IPageScrollOption = WechatMiniprogram.Page.IPageScrollOption;
+type Scroller = (this: WechatMiniprogram.Component.TrivialInstance, event?: IPageScrollOption) => void;
+export declare function pageScrollMixin(scroller: Scroller): string;
+export {};

package/example/dist/mixins/page-scroll.js

@@ -0,0 +1,42 @@
+import { isFunction } from '../common/validator';
+import { getCurrentPage, isDef } from '../common/utils';
+function onPageScroll(event) {
+    const { smartPageScroller = [] } = getCurrentPage();
+    smartPageScroller.forEach((scroller) => {
+        if (typeof scroller === 'function') {
+            // @ts-ignore
+            scroller(event);
+        }
+    });
+}
+export function pageScrollMixin(scroller) {
+    return Behavior({
+        attached() {
+            const page = getCurrentPage();
+            if (!isDef(page)) {
+                return;
+            }
+            const _scroller = scroller.bind(this);
+            const { smartPageScroller = [] } = page;
+            if (isFunction(page.onPageScroll) && page.onPageScroll !== onPageScroll) {
+                smartPageScroller.push(page.onPageScroll.bind(page));
+            }
+            smartPageScroller.push(_scroller);
+            page.smartPageScroller = smartPageScroller;
+            page.onPageScroll = onPageScroll;
+            this._scroller = _scroller;
+        },
+        detached() {
+            const page = getCurrentPage();
+            if (!isDef(page) || !isDef(page.smartPageScroller)) {
+                return;
+            }
+            const { smartPageScroller } = page;
+            const index = smartPageScroller.findIndex(v => v === this._scroller);
+            if (index > -1) {
+                page.smartPageScroller.splice(index, 1);
+            }
+            this._scroller = undefined;
+        },
+    });
+}

package/example/dist/mixins/touch.d.ts

@@ -0,0 +1 @@
+export declare const touch: string;