@tuya-miniapp/smart-ui 0.0.1-beta-1

package/lib/checkbox-group/index.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var relation_1 = require("../common/relation");
+var component_1 = require("../common/component");
+(0, component_1.VantComponent)({
+    field: true,
+    relation: (0, relation_1.useChildren)('checkbox', function (target) {
+        this.updateChild(target);
+    }),
+    props: {
+        max: Number,
+        value: {
+            type: Array,
+            observer: 'updateChildren',
+        },
+        disabled: {
+            type: Boolean,
+            observer: 'updateChildren',
+        },
+        direction: {
+            type: String,
+            value: 'vertical',
+        },
+    },
+    methods: {
+        updateChildren: function () {
+            var _this = this;
+            this.children.forEach(function (child) { return _this.updateChild(child); });
+        },
+        updateChild: function (child) {
+            var _a = this.data, value = _a.value, disabled = _a.disabled, direction = _a.direction;
+            child.setData({
+                value: value.indexOf(child.dataset.name) !== -1,
+                parentDisabled: disabled,
+                direction: direction,
+            });
+        },
+    },
+});

package/lib/checkbox-group/index.json

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

package/lib/checkbox-group/index.wxml

@@ -0,0 +1,5 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+
+<view class="{{ utils.bem('checkbox-group', [{ horizontal: direction === 'horizontal' }]) }}">
+  <slot />
+</view>

package/lib/checkbox-group/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.van-checkbox-group--horizontal{display:flex;flex-wrap:wrap}

package/lib/circle/index.css

@@ -0,0 +1 @@
+@import '../common/index.css';.van-progress-circle{align-items:center;border-radius:50%;box-sizing:border-box;display:flex;height:100px;justify-content:center;overflow:hidden;position:relative;width:100px}.van-progress-circle-box{height:100%;overflow:hidden;position:absolute;top:0;width:50%}.van-progress-circle-box-left{left:0}.van-progress-circle-box-right{right:0}.van-progress-circle-bar{height:100%;width:100%}.van-progress-circle-bar-left{transform-origin:right}.van-progress-circle-bar-right{transform-origin:left}.van-progress-circle-content{align-items:center;background:var(--app-B1,#f6f7fb);border-radius:50%;display:flex;height:100%;justify-content:center;position:relative;width:100%}

package/lib/circle/index.d.ts

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

package/lib/circle/index.js

@@ -0,0 +1,48 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var component_1 = require("../common/component");
+// @ts-ignore
+(0, component_1.VantComponent)({
+    props: {
+        className: String,
+        style: String,
+        size: {
+            type: Number,
+            value: 100,
+        },
+        trackWidth: {
+            type: Number,
+            value: 10,
+        },
+        trackColor: {
+            type: String,
+            value: '#d3d3d3',
+        },
+        fillColor: {
+            type: String,
+            value: '#007AFF',
+        },
+        percent: {
+            type: Number,
+            value: 0,
+            observer: function (val) {
+                this.updateTransform(val);
+            },
+        },
+        maskColor: {
+            type: String,
+            value: 'var(--app-B1)',
+        },
+    },
+    data: { transformLeft: '', transformRight: '' },
+    methods: {
+        updateTransform: function (val) {
+            var percent = Math.min(100, Math.max(0, val));
+            var deg = (percent / 100) * 360;
+            this.setData({
+                transformLeft: "rotate(".concat(deg >= 180 ? deg - 180 : 0, "deg)"),
+                transformRight: "rotate(".concat(deg < 180 ? deg : 180, "deg)"),
+            });
+        },
+    },
+});

package/lib/circle/index.json

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

package/lib/circle/index.wxml

@@ -0,0 +1,13 @@
+<view class="van-progress-circle" style="width:{{size}}px;height:{{size}}px;padding:{{trackWidth}}px;background:{{fillColor}};{{style}}">
+  <view class="van-progress-circle-box van-progress-circle-box-left">
+    <view class="van-progress-circle-bar van-progress-circle-bar-left" style="transform:{{transformLeft}};background:{{trackColor}};">
+    </view>
+  </view>
+  <view class="van-progress-circle-box van-progress-circle-box-right">
+    <view class="van-progress-circle-bar van-progress-circle-bar-right" style="transform:{{transformRight}};background:{{trackColor}};">
+    </view>
+  </view>
+  <view class="van-progress-circle-content" style="background:{{maskColor}};">
+    <slot></slot>
+  </view>
+</view>

package/lib/circle/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.van-progress-circle{align-items:center;border-radius:50%;box-sizing:border-box;display:flex;height:100px;justify-content:center;overflow:hidden;position:relative;width:100px}.van-progress-circle-box{height:100%;overflow:hidden;position:absolute;top:0;width:50%}.van-progress-circle-box-left{left:0}.van-progress-circle-box-right{right:0}.van-progress-circle-bar{height:100%;width:100%}.van-progress-circle-bar-left{transform-origin:right}.van-progress-circle-bar-right{transform-origin:left}.van-progress-circle-content{align-items:center;background:var(--app-B1,#f6f7fb);border-radius:50%;display:flex;height:100%;justify-content:center;position:relative;width:100%}

package/lib/col/index.css

@@ -0,0 +1 @@
+@import '../common/index.css';.van-col{box-sizing:border-box;float:left}.van-col--1{width:4.16666667%}.van-col--offset-1{margin-left:4.16666667%}.van-col--2{width:8.33333333%}.van-col--offset-2{margin-left:8.33333333%}.van-col--3{width:12.5%}.van-col--offset-3{margin-left:12.5%}.van-col--4{width:16.66666667%}.van-col--offset-4{margin-left:16.66666667%}.van-col--5{width:20.83333333%}.van-col--offset-5{margin-left:20.83333333%}.van-col--6{width:25%}.van-col--offset-6{margin-left:25%}.van-col--7{width:29.16666667%}.van-col--offset-7{margin-left:29.16666667%}.van-col--8{width:33.33333333%}.van-col--offset-8{margin-left:33.33333333%}.van-col--9{width:37.5%}.van-col--offset-9{margin-left:37.5%}.van-col--10{width:41.66666667%}.van-col--offset-10{margin-left:41.66666667%}.van-col--11{width:45.83333333%}.van-col--offset-11{margin-left:45.83333333%}.van-col--12{width:50%}.van-col--offset-12{margin-left:50%}.van-col--13{width:54.16666667%}.van-col--offset-13{margin-left:54.16666667%}.van-col--14{width:58.33333333%}.van-col--offset-14{margin-left:58.33333333%}.van-col--15{width:62.5%}.van-col--offset-15{margin-left:62.5%}.van-col--16{width:66.66666667%}.van-col--offset-16{margin-left:66.66666667%}.van-col--17{width:70.83333333%}.van-col--offset-17{margin-left:70.83333333%}.van-col--18{width:75%}.van-col--offset-18{margin-left:75%}.van-col--19{width:79.16666667%}.van-col--offset-19{margin-left:79.16666667%}.van-col--20{width:83.33333333%}.van-col--offset-20{margin-left:83.33333333%}.van-col--21{width:87.5%}.van-col--offset-21{margin-left:87.5%}.van-col--22{width:91.66666667%}.van-col--offset-22{margin-left:91.66666667%}.van-col--23{width:95.83333333%}.van-col--offset-23{margin-left:95.83333333%}.van-col--24{width:100%}.van-col--offset-24{margin-left:100%}

package/lib/col/index.d.ts

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

package/lib/col/index.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var relation_1 = require("../common/relation");
+var component_1 = require("../common/component");
+(0, component_1.VantComponent)({
+    relation: (0, relation_1.useParent)('row'),
+    props: {
+        span: Number,
+        offset: Number,
+    },
+});

package/lib/col/index.json

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

package/lib/col/index.wxml

@@ -0,0 +1,9 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+<wxs src="./index.wxs" module="computed" />
+
+<view
+  class="custom-class {{ utils.bem('col', [span]) }} {{ offset ? 'van-col--offset-' + offset : '' }}"
+  style="{{ computed.rootStyle({ gutter }) }}"
+>
+  <slot />
+</view>

package/lib/col/index.wxs

@@ -0,0 +1,18 @@
+/* eslint-disable */
+var style = require('../wxs/style.wxs');
+var addUnit = require('../wxs/add-unit.wxs');
+
+function rootStyle(data) {
+  if (!data.gutter) {
+    return '';
+  }
+
+  return style({
+    'padding-right': addUnit(data.gutter / 2),
+    'padding-left': addUnit(data.gutter / 2),
+  });
+}
+
+module.exports = {
+  rootStyle: rootStyle,
+};

package/lib/col/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.van-col{box-sizing:border-box;float:left}.van-col--1{width:4.16666667%}.van-col--offset-1{margin-left:4.16666667%}.van-col--2{width:8.33333333%}.van-col--offset-2{margin-left:8.33333333%}.van-col--3{width:12.5%}.van-col--offset-3{margin-left:12.5%}.van-col--4{width:16.66666667%}.van-col--offset-4{margin-left:16.66666667%}.van-col--5{width:20.83333333%}.van-col--offset-5{margin-left:20.83333333%}.van-col--6{width:25%}.van-col--offset-6{margin-left:25%}.van-col--7{width:29.16666667%}.van-col--offset-7{margin-left:29.16666667%}.van-col--8{width:33.33333333%}.van-col--offset-8{margin-left:33.33333333%}.van-col--9{width:37.5%}.van-col--offset-9{margin-left:37.5%}.van-col--10{width:41.66666667%}.van-col--offset-10{margin-left:41.66666667%}.van-col--11{width:45.83333333%}.van-col--offset-11{margin-left:45.83333333%}.van-col--12{width:50%}.van-col--offset-12{margin-left:50%}.van-col--13{width:54.16666667%}.van-col--offset-13{margin-left:54.16666667%}.van-col--14{width:58.33333333%}.van-col--offset-14{margin-left:58.33333333%}.van-col--15{width:62.5%}.van-col--offset-15{margin-left:62.5%}.van-col--16{width:66.66666667%}.van-col--offset-16{margin-left:66.66666667%}.van-col--17{width:70.83333333%}.van-col--offset-17{margin-left:70.83333333%}.van-col--18{width:75%}.van-col--offset-18{margin-left:75%}.van-col--19{width:79.16666667%}.van-col--offset-19{margin-left:79.16666667%}.van-col--20{width:83.33333333%}.van-col--offset-20{margin-left:83.33333333%}.van-col--21{width:87.5%}.van-col--offset-21{margin-left:87.5%}.van-col--22{width:91.66666667%}.van-col--offset-22{margin-left:91.66666667%}.van-col--23{width:95.83333333%}.van-col--offset-23{margin-left:95.83333333%}.van-col--24{width:100%}.van-col--offset-24{margin-left:100%}

package/lib/collapse/index.css

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

package/lib/collapse/index.d.ts

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

package/lib/collapse/index.js

@@ -0,0 +1,48 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var component_1 = require("../common/component");
+var relation_1 = require("../common/relation");
+(0, component_1.VantComponent)({
+    relation: (0, relation_1.useChildren)('collapse-item'),
+    props: {
+        value: {
+            type: null,
+            observer: 'updateExpanded',
+        },
+        accordion: {
+            type: Boolean,
+            observer: 'updateExpanded',
+        },
+        border: {
+            type: Boolean,
+            value: true,
+        },
+    },
+    methods: {
+        updateExpanded: function () {
+            this.children.forEach(function (child) {
+                child.updateExpanded();
+            });
+        },
+        switch: function (name, expanded) {
+            var _a = this.data, accordion = _a.accordion, value = _a.value;
+            var changeItem = name;
+            if (!accordion) {
+                name = expanded
+                    ? (value || []).concat(name)
+                    : (value || []).filter(function (activeName) { return activeName !== name; });
+            }
+            else {
+                name = expanded ? name : '';
+            }
+            if (expanded) {
+                this.$emit('open', changeItem);
+            }
+            else {
+                this.$emit('close', changeItem);
+            }
+            this.$emit('change', name);
+            this.$emit('input', name);
+        },
+    },
+});

package/lib/collapse/index.json

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

package/lib/collapse/index.wxml

@@ -0,0 +1,3 @@
+<view class="custom-class van-collapse {{ border ? 'van-hairline--top-bottom' : '' }}">
+  <slot />
+</view>

package/lib/collapse/index.wxss

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

package/lib/collapse-item/animate.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="miniprogram-api-typings" />
+export declare function setContentAnimate(context: WechatMiniprogram.Component.TrivialInstance, expanded: boolean, mounted: boolean): void;

package/lib/collapse-item/animate.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.setContentAnimate = void 0;
+var utils_1 = require("../common/utils");
+function useAnimation(context, expanded, mounted, height) {
+    var animation = wx.createAnimation({
+        duration: 0,
+        timingFunction: 'ease-in-out',
+    });
+    if (expanded) {
+        if (height === 0) {
+            animation.height('auto').top(1).step();
+        }
+        else {
+            animation
+                .height(height)
+                .top(1)
+                .step({
+                duration: mounted ? 300 : 1,
+            })
+                .height('auto')
+                .step();
+        }
+        context.setData({
+            animation: animation.export(),
+        });
+        return;
+    }
+    animation.height(height).top(0).step({ duration: 1 }).height(0).step({
+        duration: 300,
+    });
+    context.setData({
+        animation: animation.export(),
+    });
+}
+function setContentAnimate(context, expanded, mounted) {
+    (0, utils_1.getRect)(context, '.van-collapse-item__content')
+        .then(function (rect) { return rect.height; })
+        .then(function (height) {
+        useAnimation(context, expanded, mounted, height);
+    });
+}
+exports.setContentAnimate = setContentAnimate;

package/lib/collapse-item/index.css

@@ -0,0 +1 @@
+@import '../common/index.css';.van-collapse-item__title .van-cell__right-icon{transform:rotate(90deg);transition:transform var(--collapse-item-transition-duration,.3s)}.van-collapse-item__title--expanded .van-cell__right-icon{transform:rotate(-90deg)}.van-collapse-item__title--disabled .van-cell,.van-collapse-item__title--disabled .van-cell__right-icon{color:var(--collapse-item-title-disabled-color,#c8c9cc)!important}.van-collapse-item__title--disabled .van-cell--hover{background-color:#fff!important}.van-collapse-item__wrapper{overflow:hidden}.van-collapse-item__content{background-color:var(--collapse-item-content-background-color,var(--app-B6,#fff));color:var(--collapse-item-content-text-color,#969799);font-size:var(--collapse-item-content-font-size,13px);line-height:var(--collapse-item-content-line-height,1.5);padding:var(--collapse-item-content-padding,15px)}

package/lib/collapse-item/index.d.ts

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

package/lib/collapse-item/index.js

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var component_1 = require("../common/component");
+var relation_1 = require("../common/relation");
+var animate_1 = require("./animate");
+(0, component_1.VantComponent)({
+    classes: ['title-class', 'content-class'],
+    relation: (0, relation_1.useParent)('collapse'),
+    props: {
+        size: String,
+        name: null,
+        title: null,
+        value: null,
+        icon: String,
+        label: String,
+        disabled: Boolean,
+        clickable: Boolean,
+        border: {
+            type: Boolean,
+            value: true,
+        },
+        isLink: {
+            type: Boolean,
+            value: true,
+        },
+    },
+    data: {
+        expanded: false,
+    },
+    mounted: function () {
+        this.updateExpanded();
+        this.mounted = true;
+    },
+    methods: {
+        updateExpanded: function () {
+            if (!this.parent) {
+                return;
+            }
+            var _a = this.parent.data, value = _a.value, accordion = _a.accordion;
+            var _b = this.parent.children, children = _b === void 0 ? [] : _b;
+            var name = this.data.name;
+            var index = children.indexOf(this);
+            var currentName = name == null ? index : name;
+            var expanded = accordion
+                ? value === currentName
+                : (value || []).some(function (name) { return name === currentName; });
+            if (expanded !== this.data.expanded) {
+                (0, animate_1.setContentAnimate)(this, expanded, this.mounted);
+            }
+            this.setData({ index: index, expanded: expanded });
+        },
+        onClick: function () {
+            if (this.data.disabled) {
+                return;
+            }
+            var _a = this.data, name = _a.name, expanded = _a.expanded;
+            var index = this.parent.children.indexOf(this);
+            var currentName = name == null ? index : name;
+            this.parent.switch(currentName, !expanded);
+        },
+    },
+});

package/lib/collapse-item/index.json

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

package/lib/collapse-item/index.wxml

@@ -0,0 +1,45 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+
+<view class="van-collapse-item custom-class {{ index !== 0 ? 'van-hairline--top' : '' }}">
+  <van-cell
+    size="{{ size }}"
+    title="{{ title }}"
+    title-class="title-class"
+    icon="{{ icon }}"
+    value="{{ value }}"
+    label="{{ label }}"
+    is-link="{{ isLink }}"
+    clickable="{{ clickable }}"
+    border="{{ border && expanded }}"
+    class="{{ utils.bem('collapse-item__title', { disabled, expanded }) }}"
+    right-icon-class="van-cell__right-icon"
+    custom-class="van-cell"
+    hover-class="van-cell--hover"
+    bind:click="onClick"
+  >
+    <slot
+      name="title"
+      slot="title"
+    />
+    <slot
+      name="icon"
+      slot="icon"
+    />
+    <slot name="value" />
+    <slot
+      name="right-icon"
+      slot="right-icon"
+    />
+  </van-cell>
+  <view
+    class="{{ utils.bem('collapse-item__wrapper') }}"
+    style="height: 0;"
+    animation="{{ animation }}"
+  >
+    <view
+      class="van-collapse-item__content content-class"
+    >
+      <slot />
+    </view>
+  </view>
+</view>

package/lib/collapse-item/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.van-collapse-item__title .van-cell__right-icon{transform:rotate(90deg);transition:transform var(--collapse-item-transition-duration,.3s)}.van-collapse-item__title--expanded .van-cell__right-icon{transform:rotate(-90deg)}.van-collapse-item__title--disabled .van-cell,.van-collapse-item__title--disabled .van-cell__right-icon{color:var(--collapse-item-title-disabled-color,#c8c9cc)!important}.van-collapse-item__title--disabled .van-cell--hover{background-color:#fff!important}.van-collapse-item__wrapper{overflow:hidden}.van-collapse-item__content{background-color:var(--collapse-item-content-background-color,var(--app-B6,#fff));color:var(--collapse-item-content-text-color,#969799);font-size:var(--collapse-item-content-font-size,13px);line-height:var(--collapse-item-content-line-height,1.5);padding:var(--collapse-item-content-padding,15px)}

package/lib/common/color.d.ts

@@ -0,0 +1,7 @@
+export declare const RED = "#ee0a24";
+export declare const BLUE = "#1989fa";
+export declare const WHITE = "#fff";
+export declare const GREEN = "#07c160";
+export declare const ORANGE = "#ff976a";
+export declare const GRAY = "#323233";
+export declare const GRAY_DARK = "#969799";

package/lib/common/color.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GRAY_DARK = exports.GRAY = exports.ORANGE = exports.GREEN = exports.WHITE = exports.BLUE = exports.RED = void 0;
+exports.RED = '#ee0a24';
+exports.BLUE = '#1989fa';
+exports.WHITE = '#fff';
+exports.GREEN = '#07c160';
+exports.ORANGE = '#ff976a';
+exports.GRAY = '#323233';
+exports.GRAY_DARK = '#969799';

package/lib/common/component.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="miniprogram-api-typings" />
+import { VantComponentOptions } from 'definitions/index';
+declare function VantComponent<Data extends WechatMiniprogram.Component.DataOption, Props extends WechatMiniprogram.Component.PropertyOption, Methods extends WechatMiniprogram.Component.MethodOption>(vantOptions: VantComponentOptions<Data, Props, Methods>): void;
+export { VantComponent };

package/lib/common/component.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VantComponent = void 0;
+var basic_1 = require("../mixins/basic");
+function mapKeys(source, target, map) {
+    Object.keys(map).forEach(function (key) {
+        if (source[key]) {
+            target[map[key]] = source[key];
+        }
+    });
+}
+function VantComponent(vantOptions) {
+    var options = {};
+    mapKeys(vantOptions, options, {
+        data: 'data',
+        props: 'properties',
+        watch: 'observers',
+        mixins: 'behaviors',
+        methods: 'methods',
+        beforeCreate: 'created',
+        created: 'attached',
+        mounted: 'ready',
+        destroyed: 'detached',
+        classes: 'externalClasses',
+    });
+    // add default externalClasses
+    options.externalClasses = options.externalClasses || [];
+    options.externalClasses.push('custom-class');
+    // add default behaviors
+    options.behaviors = options.behaviors || [];
+    options.behaviors.push(basic_1.basic);
+    // add relations
+    var relation = vantOptions.relation;
+    if (relation) {
+        options.relations = relation.relations;
+        options.behaviors.push(relation.mixin);
+    }
+    // map field to form-field behavior
+    // if (vantOptions.field) {
+    //   options.behaviors.push('wx://form-field');
+    // }
+    // add default options
+    options.options = {
+        multipleSlots: true,
+        addGlobalClass: true,
+    };
+    Component(options);
+}
+exports.VantComponent = VantComponent;

package/lib/common/index.css

@@ -0,0 +1 @@
+.van-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.van-multi-ellipsis--l2{-webkit-line-clamp:2}.van-multi-ellipsis--l2,.van-multi-ellipsis--l3{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;text-overflow:ellipsis}.van-multi-ellipsis--l3{-webkit-line-clamp:3}.van-clearfix:after{clear:both;content:"";display:table}.van-hairline,.van-hairline--bottom,.van-hairline--left,.van-hairline--right,.van-hairline--surround,.van-hairline--top,.van-hairline--top-bottom{position:relative}.van-hairline--bottom:after,.van-hairline--left:after,.van-hairline--right:after,.van-hairline--surround:after,.van-hairline--top-bottom:after,.van-hairline--top:after,.van-hairline:after{border:0 solid var(--app-B6-N7,rgba(0,0,0,.1));bottom:-50%;box-sizing:border-box;content:" ";left:-50%;pointer-events:none;position:absolute;right:-50%;top:-50%;transform:scale(.5);transform-origin:center}.van-hairline--top:after{border-top-width:1px}.van-hairline--left:after{border-left-width:1px}.van-hairline--right:after{border-right-width:1px}.van-hairline--bottom:after{border-bottom-width:1px}.van-hairline--top-bottom:after{border-width:1px 0}.van-hairline--surround:after{border-width:1px}

package/lib/common/index.wxss

@@ -0,0 +1 @@
+.van-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.van-multi-ellipsis--l2{-webkit-line-clamp:2}.van-multi-ellipsis--l2,.van-multi-ellipsis--l3{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;text-overflow:ellipsis}.van-multi-ellipsis--l3{-webkit-line-clamp:3}.van-clearfix:after{clear:both;content:"";display:table}.van-hairline,.van-hairline--bottom,.van-hairline--left,.van-hairline--right,.van-hairline--surround,.van-hairline--top,.van-hairline--top-bottom{position:relative}.van-hairline--bottom:after,.van-hairline--left:after,.van-hairline--right:after,.van-hairline--surround:after,.van-hairline--top-bottom:after,.van-hairline--top:after,.van-hairline:after{border:0 solid var(--app-B6-N7,rgba(0,0,0,.1));bottom:-50%;box-sizing:border-box;content:" ";left:-50%;pointer-events:none;position:absolute;right:-50%;top:-50%;transform:scale(.5);transform-origin:center}.van-hairline--top:after{border-top-width:1px}.van-hairline--left:after{border-left-width:1px}.van-hairline--right:after{border-right-width:1px}.van-hairline--bottom:after{border-bottom-width:1px}.van-hairline--top-bottom:after{border-width:1px 0}.van-hairline--surround:after{border-width:1px}

package/lib/common/relation.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="miniprogram-api-typings" />
+type TrivialInstance = WechatMiniprogram.Component.TrivialInstance;
+export declare function useParent(name: string, onEffect?: (this: TrivialInstance) => void): {
+    relations: {
+        [x: string]: WechatMiniprogram.Component.RelationOption;
+    };
+    mixin: string;
+};
+export declare function useChildren(name: string, onEffect?: (this: TrivialInstance, target: TrivialInstance) => void): {
+    relations: {
+        [x: string]: WechatMiniprogram.Component.RelationOption;
+    };
+    mixin: string;
+};
+export {};

package/lib/common/relation.js

@@ -0,0 +1,65 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useChildren = exports.useParent = void 0;
+function useParent(name, onEffect) {
+    var _a;
+    var path = "../".concat(name, "/index");
+    return {
+        relations: (_a = {},
+            _a[path] = {
+                type: 'ancestor',
+                linked: function () {
+                    onEffect && onEffect.call(this);
+                },
+                linkChanged: function () {
+                    onEffect && onEffect.call(this);
+                },
+                unlinked: function () {
+                    onEffect && onEffect.call(this);
+                },
+            },
+            _a),
+        mixin: Behavior({
+            created: function () {
+                var _this = this;
+                Object.defineProperty(this, 'parent', {
+                    get: function () { return _this.getRelationNodes(path)[0]; },
+                });
+                Object.defineProperty(this, 'index', {
+                    // @ts-ignore
+                    get: function () { var _a, _b; return (_b = (_a = _this.parent) === null || _a === void 0 ? void 0 : _a.children) === null || _b === void 0 ? void 0 : _b.indexOf(_this); },
+                });
+            },
+        }),
+    };
+}
+exports.useParent = useParent;
+function useChildren(name, onEffect) {
+    var _a;
+    var path = "../".concat(name, "/index");
+    return {
+        relations: (_a = {},
+            _a[path] = {
+                type: 'descendant',
+                linked: function (target) {
+                    onEffect && onEffect.call(this, target);
+                },
+                linkChanged: function (target) {
+                    onEffect && onEffect.call(this, target);
+                },
+                unlinked: function (target) {
+                    onEffect && onEffect.call(this, target);
+                },
+            },
+            _a),
+        mixin: Behavior({
+            created: function () {
+                var _this = this;
+                Object.defineProperty(this, 'children', {
+                    get: function () { return _this.getRelationNodes(path) || []; },
+                });
+            },
+        }),
+    };
+}
+exports.useChildren = useChildren;

package/lib/common/style/clearfix.css

@@ -0,0 +1 @@
+.van-clearfix:after{clear:both;content:"";display:table}

package/lib/common/style/clearfix.wxss

@@ -0,0 +1 @@
+.van-clearfix:after{clear:both;content:"";display:table}

package/lib/common/style/ellipsis.css

@@ -0,0 +1 @@
+.van-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.van-multi-ellipsis--l2{-webkit-line-clamp:2}.van-multi-ellipsis--l2,.van-multi-ellipsis--l3{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;text-overflow:ellipsis}.van-multi-ellipsis--l3{-webkit-line-clamp:3}

package/lib/common/style/ellipsis.wxss

@@ -0,0 +1 @@
+.van-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.van-multi-ellipsis--l2{-webkit-line-clamp:2}.van-multi-ellipsis--l2,.van-multi-ellipsis--l3{-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden;text-overflow:ellipsis}.van-multi-ellipsis--l3{-webkit-line-clamp:3}

package/lib/common/style/hairline.css

@@ -0,0 +1 @@
+.van-hairline,.van-hairline--bottom,.van-hairline--left,.van-hairline--right,.van-hairline--surround,.van-hairline--top,.van-hairline--top-bottom{position:relative}.van-hairline--bottom:after,.van-hairline--left:after,.van-hairline--right:after,.van-hairline--surround:after,.van-hairline--top-bottom:after,.van-hairline--top:after,.van-hairline:after{border:0 solid var(--app-B6-N7,rgba(0,0,0,.1));bottom:-50%;box-sizing:border-box;content:" ";left:-50%;pointer-events:none;position:absolute;right:-50%;top:-50%;transform:scale(.5);transform-origin:center}.van-hairline--top:after{border-top-width:1px}.van-hairline--left:after{border-left-width:1px}.van-hairline--right:after{border-right-width:1px}.van-hairline--bottom:after{border-bottom-width:1px}.van-hairline--top-bottom:after{border-width:1px 0}.van-hairline--surround:after{border-width:1px}

package/lib/common/style/hairline.wxss

@@ -0,0 +1 @@
+.van-hairline,.van-hairline--bottom,.van-hairline--left,.van-hairline--right,.van-hairline--surround,.van-hairline--top,.van-hairline--top-bottom{position:relative}.van-hairline--bottom:after,.van-hairline--left:after,.van-hairline--right:after,.van-hairline--surround:after,.van-hairline--top-bottom:after,.van-hairline--top:after,.van-hairline:after{border:0 solid var(--app-B6-N7,rgba(0,0,0,.1));bottom:-50%;box-sizing:border-box;content:" ";left:-50%;pointer-events:none;position:absolute;right:-50%;top:-50%;transform:scale(.5);transform-origin:center}.van-hairline--top:after{border-top-width:1px}.van-hairline--left:after{border-left-width:1px}.van-hairline--right:after{border-right-width:1px}.van-hairline--bottom:after{border-bottom-width:1px}.van-hairline--top-bottom:after{border-width:1px 0}.van-hairline--surround:after{border-width:1px}