@tuya-miniapp/smart-ui 2.7.1-beta-13 → 2.7.2-beta-0

package/lib/field/index.js

@@ -0,0 +1,160 @@
+"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);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var utils_1 = require("../common/utils");
+var component_1 = require("../common/component");
+var props_1 = require("./props");
+var Xmark_1 = __importDefault(require("@tuya-miniapp/icons/dist/svg/Xmark"));
+(0, component_1.SmartComponent)({
+    field: true,
+    classes: ['input-class', 'right-icon-class', 'label-class'],
+    props: __assign(__assign(__assign(__assign({}, props_1.commonProps), props_1.inputProps), props_1.textareaProps), { size: String, icon: String, label: String, error: Boolean, center: Boolean, isLink: Boolean, leftIcon: String, rightIcon: String, autosize: null, required: Boolean, interError: Boolean, inputAlign: {
+            type: String,
+        }, subLabel: String, cardMode: Boolean, iconClass: String, clickable: Boolean, customStyle: String, errorMessage: String, arrowDirection: String, showWordLimit: Boolean, errorMessageAlign: String, hiddenLabel: Boolean, readonly: {
+            type: Boolean,
+            observer: 'setShowClear',
+        }, clearable: {
+            type: Boolean,
+            observer: 'setShowClear',
+        }, clearTrigger: {
+            type: String,
+            value: 'focus',
+        }, border: {
+            type: Boolean,
+            value: false,
+        }, titleWidth: {
+            type: String,
+            value: '6.2em',
+        }, clearIcon: {
+            type: String,
+            value: Xmark_1.default,
+        }, extraEventParams: {
+            type: Boolean,
+            value: false,
+        } }),
+    data: {
+        focused: false,
+        innerValue: '',
+        showClear: false,
+    },
+    watch: {
+        value: function (value) {
+            if (value !== this.value) {
+                this.setData({ innerValue: value });
+                this.value = value;
+                this.setShowClear();
+            }
+        },
+        clearTrigger: function () {
+            this.setShowClear();
+        },
+    },
+    created: function () {
+        this.value = this.data.value;
+        this.setData({ innerValue: this.value });
+    },
+    methods: {
+        formatValue: function (value) {
+            var maxlength = this.data.maxlength;
+            if (maxlength !== -1 && value.length > maxlength) {
+                return value.slice(0, maxlength);
+            }
+            return value;
+        },
+        onInput: function (event) {
+            var _a = (event.detail || {}).value, value = _a === void 0 ? '' : _a;
+            var formatValue = this.formatValue(value);
+            this.value = formatValue;
+            this.setShowClear();
+            return this.emitChange(__assign(__assign({}, event.detail), { value: formatValue }));
+        },
+        onFocus: function (event) {
+            this.focused = true;
+            this.setShowClear();
+            this.$emit('focus', event.detail);
+        },
+        onBlur: function (event) {
+            this.focused = false;
+            this.setShowClear();
+            this.$emit('blur', event.detail);
+        },
+        onClickIcon: function () {
+            this.$emit('click-icon');
+        },
+        onClickInput: function (event) {
+            this.$emit('click-input', event.detail);
+        },
+        onClear: function () {
+            var _this = this;
+            this.setData({ innerValue: '' });
+            this.value = '';
+            this.setShowClear();
+            (0, utils_1.nextTick)(function () {
+                _this.emitChange({ value: '' });
+                _this.$emit('clear', '');
+            });
+        },
+        onConfirm: function (event) {
+            var _a = (event.detail || {}).value, value = _a === void 0 ? '' : _a;
+            this.value = value;
+            this.setShowClear();
+            this.$emit('confirm', value);
+        },
+        setValue: function (value) {
+            this.value = value;
+            this.setShowClear();
+            if (value === '') {
+                this.setData({ innerValue: '' });
+            }
+            this.emitChange({ value: value });
+        },
+        onLineChange: function (event) {
+            this.$emit('linechange', event.detail);
+        },
+        onKeyboardHeightChange: function (event) {
+            this.$emit('keyboardheightchange', event.detail);
+        },
+        onBindNicknameReview: function (event) {
+            this.$emit('nicknamereview', event.detail);
+        },
+        emitChange: function (detail) {
+            var _this = this;
+            var extraEventParams = this.data.extraEventParams;
+            this.setData({ value: detail.value });
+            var result;
+            var data = extraEventParams
+                ? __assign(__assign({}, detail), { callback: function (data) {
+                        result = data;
+                        _this.setData({ innerValue: data.value });
+                    } }) : detail.value;
+            this.$emit('input', data);
+            this.$emit('change', data);
+            return result;
+        },
+        setShowClear: function () {
+            var _a = this.data, clearable = _a.clearable, readonly = _a.readonly, clearTrigger = _a.clearTrigger;
+            var _b = this, focused = _b.focused, value = _b.value;
+            var showClear = false;
+            if (clearable && !readonly) {
+                var hasValue = !!value;
+                var trigger = clearTrigger === 'always' || (clearTrigger === 'focus' && focused);
+                showClear = hasValue && trigger;
+            }
+            this.setView({ showClear: showClear });
+        },
+        noop: function () { },
+    },
+});

package/lib/field/index.json

@@ -0,0 +1,7 @@
+{
+  "component": true,
+  "usingComponents": {
+    "smart-cell": "../cell/index",
+    "smart-icon": "../icon/index"
+  }
+}

package/lib/field/index.wxml

@@ -0,0 +1,4 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+<wxs src="./index.wxs" module="computed" />
+<include wx:if="{{ type === 'textarea' }}" src="./cell-textarea.wxml" />
+<include wx:else src="./cell-input.wxml" />

package/lib/field/index.wxs

@@ -0,0 +1,19 @@
+/* eslint-disable */
+var style = require('../wxs/style.wxs');
+var addUnit = require('../wxs/add-unit.wxs');
+
+function inputStyle(autosize) {
+  if (autosize && autosize.constructor === 'Object') {
+    return style({
+      'min-height': addUnit(autosize.minHeight),
+      'max-height': addUnit(autosize.maxHeight),
+      overflow: 'auto',
+    });
+  }
+
+  return '';
+}
+
+module.exports = {
+  inputStyle: inputStyle,
+};

package/lib/field/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-field{--cell-icon-size:var(--field-icon-size,16px)}.smart-field__left__body{align-items:center;display:flex;padding-right:var(--field-left-body-padding-right,16px);text-align:left}.smart-field__left__body--disabled{opacity:var(--field-disabled-opacity,.7)}.smart-field__label{color:var(--field-label-color,var(--app-B6-N1,#000));font-size:var(--field-label-font-size,16px);line-height:var(--field-label-line-height,18px);text-align:left}.smart-field__label--required{color:var(--field-input-error-text-color,var(--app-M2,#f04c4c))}.smart-field__label:empty{display:none}.smart-field__left__icon{display:flex;margin-right:var(--field-left-icon-margin-right,10px)}.smart-field__left__icon:empty{display:none}.smart-field__label__card__subtitle{color:var(--field-subtitle-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));font-size:var(--field-sub-label-font-size,14px);line-height:var(--field-sub-label-line-height,16px);margin-top:4px}.smart-field__label__card__subtitle--error{color:var(--field-error-message-color,var(--app-M2,#f04c4c))}.smart-field__body__box{flex:1}.smart-field__body__box--disabled{opacity:var(--field-disabled-opacity,.7)}.smart-field__body{align-items:center;display:flex;justify-content:flex-end}.smart-field__body--textarea{background-color:var(--field-textarea-background,var(--app-B3,#fff));border-radius:var(--field-textarea-border-radius,8px);padding:var(--field-textarea-padding,12px 8px)}.smart-field__body--limit{padding-bottom:var(--field-textarea-limit-padding-bottom,20px)}.smart-field__control:empty+.smart-field__control{display:block}.smart-field__control{background-color:initial;border:0;box-sizing:border-box;color:var(--field-input-text-color,var(--app-B6-N1,#000));display:none;font-size:var(--field-input-text-font-size,16px);height:var(--cell-line-height,24px);line-height:inherit;margin:0;min-height:var(--cell-line-height,24px);padding:0;position:relative;resize:none;text-align:right;width:100%}.smart-field__control:empty{display:none}.smart-field__control--textarea{height:var(--field-textarea-min-height,130px);min-height:var(--field-textarea-min-height,130px);text-align:left}.smart-field__control--card{background:var(--field-card-background,var(--app-B6-N7,rgba(0,0,0,.1)));border-radius:var(--field-card-border-radius,8px);height:var(--field-card-height,38px);padding:var(--field-card-padding,0 10px);text-align:center;width:var(--field-card-width,105px)}.smart-field__control--center{text-align:center}.smart-field__control--right{text-align:right}.smart-field__control--left{text-align:left}.smart-field__control--custom{align-items:center;display:flex;min-height:var(--cell-line-height,24px)}.smart-field__control--readonly{position:relative}.smart-field__control--readonly:after{content:"";height:100%;left:0;position:absolute;top:0;width:100%;z-index:10}.smart-field__icon-root{align-items:center;display:flex;min-height:var(--cell-line-height,24px)}.smart-field__clear-root,.smart-field__icon-container{line-height:inherit;margin-right:calc(var(--padding-xs, 8px)*-1);padding:0 var(--padding-xs,8px);vertical-align:middle}.smart-field__button,.smart-field__clear-root,.smart-field__icon-container{flex-shrink:0}.smart-field__clear-root{--icon-color:var(--field-clear-icon-color,var(--app-B6-N4,rgba(0,0,0,.4)));font-size:var(--field-clear-icon-size,16px)}.smart-field__icon-container{--icon-color:var(--field-icon-container-color,#969799);font-size:var(--field-icon-size,16px)}.smart-field__icon-container:empty{display:none}.smart-field__button{padding-left:var(--padding-xs,8px)}.smart-field__button:empty{display:none}.smart-field__error-message{word-wrap:break-word;color:var(--field-error-message-color,var(--app-M2,#f04c4c));display:block;font-size:var(--field-error-message-text-font-size,14px);font-weight:400;line-height:var(--field-error-message-text-line-height,18px);text-align:right;white-space:normal}.smart-field__error-message--center{text-align:center}.smart-field__error-message--right{text-align:right}.smart-field--textarea{padding:0 16px}.smart-field--textarea .smart-field__left__body{margin-bottom:8px;width:100%}.smart-field--textarea .smart-field__body__box{position:relative}.smart-field__word-limit{bottom:8px;color:var(--field-word-limit-color,var(--app-B6-N4,rgba(0,0,0,.4)));font-size:var(--field-word-limit-font-size,10px);line-height:var(--field-word-limit-line-height,14px);margin-top:var(--padding-base,4px);position:absolute;right:8px;text-align:right}.smart-field__word-num{display:inline}.smart-field__word-num--full{color:var(--field-word-num-full-color,var(--app-M2,#f04c4c))}

package/lib/field/input.wxml

@@ -0,0 +1,30 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+<input
+  id="{{ name }}"
+  class="{{ utils.bem('field__control', [inputAlign, type, { card: cardMode, readonly }]) }} input-class"
+  type="{{ type }}"
+  focus="{{ focus }}"
+  cursor="{{ cursor }}"
+  value="{{ innerValue }}"
+  auto-focus="{{ autoFocus }}"
+  disabled="{{ disabled }}"
+  maxlength="{{ maxlength }}"
+  placeholder="{{ !interError ? placeholder : errorMessage || placeholder }}"
+  placeholder-style="{{ interError ? 'color: var(--field-input-error-text-color, var(--app-M2, #f04c4c));' : 'color: var(--field-placeholder-text-color, var(--app-B6-N4, rgba(0, 0, 0, 0.4)));'}}{{ placeholderStyle }}"
+  confirm-type="{{ confirmType }}"
+  confirm-hold="{{ confirmHold }}"
+  hold-keyboard="{{ holdKeyboard }}"
+  cursor-spacing="{{ cursorSpacing }}"
+  adjust-position="{{ adjustPosition }}"
+  selection-end="{{ selectionEnd }}"
+  selection-start="{{ selectionStart }}"
+  always-embed="{{ alwaysEmbed }}"
+  password="{{ password || type === 'password' }}"
+  bindinput="onInput"
+  bindtap="onClickInput"
+  bindblur="onBlur"
+  bindfocus="onFocus"
+  bindconfirm="onConfirm"
+  bindkeyboardheightchange="onKeyboardHeightChange"
+  bindnicknamereview="onBindNicknameReview"
+/>

package/lib/field/props.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="miniprogram-api-typings" />
+export declare const commonProps: WechatMiniprogram.Component.PropertyOption;
+export declare const inputProps: WechatMiniprogram.Component.PropertyOption;
+export declare const textareaProps: WechatMiniprogram.Component.PropertyOption;

package/lib/field/props.js

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.textareaProps = exports.inputProps = exports.commonProps = void 0;
+exports.commonProps = {
+    value: String,
+    placeholder: String,
+    placeholderStyle: String,
+    placeholderClass: String,
+    disabled: Boolean,
+    maxlength: {
+        type: Number,
+        value: -1,
+    },
+    cursorSpacing: {
+        type: Number,
+        value: 50,
+    },
+    autoFocus: Boolean,
+    focus: Boolean,
+    cursor: {
+        type: Number,
+        value: -1,
+    },
+    selectionStart: {
+        type: Number,
+        value: -1,
+    },
+    selectionEnd: {
+        type: Number,
+        value: -1,
+    },
+    adjustPosition: {
+        type: Boolean,
+        value: true,
+    },
+    holdKeyboard: Boolean,
+};
+exports.inputProps = {
+    type: {
+        type: String,
+        value: 'text',
+    },
+    password: Boolean,
+    confirmType: String,
+    confirmHold: Boolean,
+    alwaysEmbed: Boolean,
+};
+exports.textareaProps = {
+    autoHeight: Boolean,
+    fixed: Boolean,
+    showConfirmBar: {
+        type: Boolean,
+        value: true,
+    },
+    disableDefaultPadding: {
+        type: Boolean,
+        value: true,
+    },
+};

package/lib/field/textarea.wxml

@@ -0,0 +1,32 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+<wxs src="./index.wxs" module="computed" />
+
+<textarea
+  id="{{ name }}"
+  class="{{ utils.bem('field__control', [inputAlign, type, { textarea: true, limit: showWordLimit && maxlength, readonly }]) }} input-class"
+  fixed="{{ fixed }}"
+  focus="{{ focus }}"
+  cursor="{{ cursor }}"
+  value="{{ innerValue }}"
+  auto-focus="{{ autoFocus }}"
+  disabled="{{ disabled }}"
+  maxlength="{{ maxlength }}"
+  placeholder="{{ !interError ? placeholder : errorMessage || placeholder }}"
+  placeholder-style="{{ interError ? 'color: var(--field-input-error-text-color, var(--app-M2, #f04c4c));' : 'color: var(--field-placeholder-text-color, var(--app-B6-N4, rgba(0, 0, 0, 0.4)));'}}{{ placeholderStyle }}"
+  auto-height="{{ !!autosize }}"
+  style="{{ computed.inputStyle(autosize) }}"
+  cursor-spacing="{{ cursorSpacing }}"
+  adjust-position="{{ adjustPosition }}"
+  show-confirm-bar="{{ showConfirmBar }}"
+  hold-keyboard="{{ holdKeyboard }}"
+  selection-end="{{ selectionEnd }}"
+  selection-start="{{ selectionStart }}"
+  disable-default-padding="{{ disableDefaultPadding }}"
+  bindinput="onInput"
+  bindtap="onClickInput"
+  bindblur="onBlur"
+  bindfocus="onFocus"
+  bindconfirm="onConfirm"
+  bindlinechange="onLineChange"
+  bindkeyboardheightchange="onKeyboardHeightChange"
+/>

package/lib/field/types.d.ts

@@ -0,0 +1,8 @@
+export interface InputDetails {
+    /** 输入框内容 */
+    value: string;
+    /** 光标位置 */
+    cursor?: number;
+    /** keyCode 为键值 (目前工具还不支持返回keyCode参数) `2.1.0` 起支持 */
+    keyCode?: number;
+}

package/lib/field/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/goods-action/index.css

@@ -0,0 +1 @@
+@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-goods-action{align-items:center;background-color:var(--goods-action-background-color,var(--app-B4,#fff));bottom:0;box-sizing:initial;display:flex;height:var(--goods-action-height,48px);left:0;position:fixed;right:0}.smart-goods-action--safe{padding-bottom:env(safe-area-inset-bottom)}

package/lib/goods-action/index.d.ts

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

package/lib/goods-action/index.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var component_1 = require("../common/component");
+var relation_1 = require("../common/relation");
+(0, component_1.SmartComponent)({
+    relation: (0, relation_1.useChildren)('goods-action-button', function () {
+        this.children.forEach(function (item) {
+            item.updateStyle();
+        });
+    }),
+    props: {
+        safeAreaInsetBottom: {
+            type: Boolean,
+            value: true,
+        },
+    },
+});

package/lib/goods-action/index.json

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

package/lib/goods-action/index.wxml

@@ -0,0 +1,5 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+
+<view class="custom-class {{ utils.bem('goods-action', { safe: safeAreaInsetBottom }) }}">
+  <slot />
+</view>

package/lib/goods-action/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-goods-action{align-items:center;background-color:var(--goods-action-background-color,var(--app-B4,#fff));bottom:0;box-sizing:initial;display:flex;height:var(--goods-action-height,48px);left:0;position:fixed;right:0}.smart-goods-action--safe{padding-bottom:env(safe-area-inset-bottom)}

package/lib/goods-action-button/index.css

@@ -0,0 +1 @@
+@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}:host{flex:1}.smart-goods-action-button{--button-warning-background-color:var(--goods-action-button-warning-color,linear-gradient(to right,#ffd01e,#ff8917));--button-danger-background-color:var(--goods-action-button-danger-color,linear-gradient(to right,#ff6034,#ee0a24));--button-default-height:var(--button-default-height,var(--goods-action-button-height,48px));--button-line-height:var(--goods-action-button-line-height,20px);--button-plain-background-color:var(--goods-action-button-plain-color,var(--app-B4,#fff));--button-border-width:0;display:block}.smart-goods-action-button--first{--button-border-radius:var(--goods-action-button-border-radius,999px) 0 0 var(--goods-action-button-border-radius,999px);margin-right:6px}.smart-goods-action-button--last{--button-border-radius:0 var(--goods-action-button-border-radius,999px) var(--goods-action-button-border-radius,999px) 0;margin-left:6px}.smart-goods-action-button--first.smart-goods-action-button--last{--button-border-radius:var(--goods-action-button-border-radius,999px)}.smart-goods-action-button--plain{--button-border-width:1px}.smart-goods-action-button__inner{font-weight:var(--font-weight-bold,500)!important;width:100%}@media (max-width:321px){.smart-goods-action-button{font-size:13px}}

package/lib/goods-action-button/index.d.ts

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

package/lib/goods-action-button/index.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var component_1 = require("../common/component");
+var relation_1 = require("../common/relation");
+var button_1 = require("../mixins/button");
+var link_1 = require("../mixins/link");
+(0, component_1.SmartComponent)({
+    mixins: [link_1.link, button_1.button],
+    relation: (0, relation_1.useParent)('goods-action'),
+    props: {
+        text: String,
+        color: String,
+        size: {
+            type: String,
+            value: 'normal',
+        },
+        loading: Boolean,
+        disabled: Boolean,
+        plain: Boolean,
+        type: {
+            type: String,
+            value: 'danger',
+        },
+        customStyle: {
+            type: String,
+            value: '',
+        },
+        isFirst: Boolean,
+        isLast: Boolean,
+    },
+    methods: {
+        onClick: function (event) {
+            this.$emit('click', event.detail);
+            this.jumpLink();
+        },
+        updateStyle: function () {
+            if (this.parent == null) {
+                return;
+            }
+            var index = this.index;
+            var _a = this.parent.children, children = _a === void 0 ? [] : _a;
+            // this.setData({
+            //   isFirst: index === 0 && children.length > 1,
+            //   isLast: index === children.length - 1 && children.length > 1,
+            // });
+            this.setData({
+                length: children.length,
+            });
+        },
+    },
+});

package/lib/goods-action-button/index.json

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

package/lib/goods-action-button/index.wxml

@@ -0,0 +1,35 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+<smart-button
+  id="{{ id }}"
+  button-id="{{ buttonId }}"
+  lang="{{ lang }}"
+  type="{{ type }}"
+  size="{{ size }}"
+  color="{{ color }}"
+  plain="{{ plain }}"
+  loading="{{ loading }}"
+  disabled="{{ disabled }}"
+  open-type="{{ openType }}"
+  class="{{ utils.bem('goods-action-button', [type, { first: isFirst && length > 1, last: isLast && length > 1, plain: plain }])}}"
+  custom-class="smart-goods-action-button__inner custom-class"
+  custom-style="{{customStyle}}"
+  business-id="{{ businessId }}"
+  session-from="{{ sessionFrom }}"
+  app-parameter="{{ appParameter }}"
+  send-message-img="{{ sendMessageImg }}"
+  send-message-path="{{ sendMessagePath }}"
+  show-message-card="{{ showMessageCard }}"
+  send-message-title="{{ sendMessageTitle }}"
+  bind:click="onClick"
+  binderror="onError"
+  bindcontact="onContact"
+  bindopensetting="onOpenSetting"
+  bindgetuserinfo="onGetUserInfo"
+  bindagreeprivacyauthorization="onAgreePrivacyAuthorization"
+  bindgetRealTimePhoneNumber="onGetRealTimePhoneNumber"
+  bindgetphonenumber="onGetPhoneNumber"
+  bindlaunchapp="onLaunchApp"
+>
+  {{ text }}
+  <slot></slot>
+</smart-button>

package/lib/goods-action-button/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}:host{flex:1}.smart-goods-action-button{--button-warning-background-color:var(--goods-action-button-warning-color,linear-gradient(to right,#ffd01e,#ff8917));--button-danger-background-color:var(--goods-action-button-danger-color,linear-gradient(to right,#ff6034,#ee0a24));--button-default-height:var(--button-default-height,var(--goods-action-button-height,48px));--button-line-height:var(--goods-action-button-line-height,20px);--button-plain-background-color:var(--goods-action-button-plain-color,var(--app-B4,#fff));--button-border-width:0;display:block}.smart-goods-action-button--first{--button-border-radius:var(--goods-action-button-border-radius,999px) 0 0 var(--goods-action-button-border-radius,999px);margin-right:6px}.smart-goods-action-button--last{--button-border-radius:0 var(--goods-action-button-border-radius,999px) var(--goods-action-button-border-radius,999px) 0;margin-left:6px}.smart-goods-action-button--first.smart-goods-action-button--last{--button-border-radius:var(--goods-action-button-border-radius,999px)}.smart-goods-action-button--plain{--button-border-width:1px}.smart-goods-action-button__inner{font-weight:var(--font-weight-bold,500)!important;width:100%}@media (max-width:321px){.smart-goods-action-button{font-size:13px}}

package/lib/goods-action-icon/index.css

@@ -0,0 +1 @@
+@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-goods-action-icon{border:none!important;color:var(--goods-action-icon-text-color,#646566)!important;display:flex!important;flex-direction:column;font-size:var(--goods-action-icon-font-size,10px)!important;height:var(--goods-action-icon-height,48px)!important;justify-content:center!important;line-height:1!important;min-width:var(--goods-action-icon-width,48px)}.smart-goods-action-icon__icon{color:var(--goods-action-icon-color,#323233);display:flex;font-size:var(--goods-action-icon-size,18px);margin:0 auto 5px}

package/lib/goods-action-icon/index.d.ts

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

package/lib/goods-action-icon/index.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var component_1 = require("../common/component");
+var button_1 = require("../mixins/button");
+var link_1 = require("../mixins/link");
+(0, component_1.SmartComponent)({
+    classes: ['icon-class', 'text-class', 'info-class'],
+    mixins: [link_1.link, button_1.button],
+    props: {
+        text: String,
+        dot: Boolean,
+        info: String,
+        icon: String,
+        size: String,
+        color: String,
+        classPrefix: {
+            type: String,
+            value: 'smart-icon',
+        },
+        disabled: Boolean,
+        loading: Boolean,
+    },
+    methods: {
+        onClick: function (event) {
+            this.$emit('click', event.detail);
+            this.jumpLink();
+        },
+    },
+});

package/lib/goods-action-icon/index.json

@@ -0,0 +1,7 @@
+{
+  "component": true,
+  "usingComponents": {
+    "smart-icon": "../icon/index",
+    "smart-button": "../button/index"
+  }
+}

package/lib/goods-action-icon/index.wxml

@@ -0,0 +1,41 @@
+<smart-button
+  square
+  id="{{ id }}"
+  size="large"
+  lang="{{ lang }}"
+  loading="{{ loading }}"
+  disabled="{{ disabled }}"
+  open-type="{{ openType }}"
+  business-id="{{ businessId }}"
+  custom-class="smart-goods-action-icon"
+  session-from="{{ sessionFrom }}"
+  app-parameter="{{ appParameter }}"
+  send-message-img="{{ sendMessageImg }}"
+  send-message-path="{{ sendMessagePath }}"
+  show-message-card="{{ showMessageCard }}"
+  send-message-title="{{ sendMessageTitle }}"
+  bind:click="onClick"
+  binderror="onError"
+  bindcontact="onContact"
+  bindopensetting="onOpenSetting"
+  bindgetuserinfo="onGetUserInfo"
+  bindgetphonenumber="onGetPhoneNumber"
+  bindlaunchapp="onLaunchApp"
+>
+  <smart-icon
+    wx:if="{{ icon }}"
+    name="{{ icon }}"
+    dot="{{ dot }}"
+    info="{{ info }}"
+    size="{{ size }}"
+    color="{{ color }}"
+    class-prefix="{{ classPrefix }}"
+    class="smart-goods-action-icon__icon"
+    custom-class="icon-class"
+    info-class="info-class"
+  />
+  <view wx:else>
+    <slot name="icon" />
+  </view>
+  <text class="text-class">{{ text }}</text>
+</smart-button>

package/lib/goods-action-icon/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-goods-action-icon{border:none!important;color:var(--goods-action-icon-text-color,#646566)!important;display:flex!important;flex-direction:column;font-size:var(--goods-action-icon-font-size,10px)!important;height:var(--goods-action-icon-height,48px)!important;justify-content:center!important;line-height:1!important;min-width:var(--goods-action-icon-width,48px)}.smart-goods-action-icon__icon{color:var(--goods-action-icon-color,#323233);display:flex;font-size:var(--goods-action-icon-size,18px);margin:0 auto 5px}

package/lib/grid/index.css

@@ -0,0 +1 @@
+@import '../common/index.css';.smart-grid{box-sizing:border-box;overflow:hidden;position:relative}

package/lib/grid/index.d.ts

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

package/lib/grid/index.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var component_1 = require("../common/component");
+var relation_1 = require("../common/relation");
+(0, component_1.SmartComponent)({
+    relation: (0, relation_1.useChildren)('grid-item'),
+    props: {
+        square: {
+            type: Boolean,
+            observer: 'updateChildren',
+        },
+        gutter: {
+            type: null,
+            value: 0,
+            observer: 'updateChildren',
+        },
+        clickable: {
+            type: Boolean,
+            observer: 'updateChildren',
+        },
+        columnNum: {
+            type: Number,
+            value: 4,
+            observer: 'updateChildren',
+        },
+        center: {
+            type: Boolean,
+            value: true,
+            observer: 'updateChildren',
+        },
+        border: {
+            type: Boolean,
+            value: true,
+            observer: 'updateChildren',
+        },
+        direction: {
+            type: String,
+            observer: 'updateChildren',
+        },
+        iconSize: {
+            type: String,
+            observer: 'updateChildren',
+        },
+        reverse: {
+            type: Boolean,
+            value: false,
+            observer: 'updateChildren',
+        },
+    },
+    methods: {
+        updateChildren: function () {
+            this.children.forEach(function (child) {
+                child.updateStyle();
+            });
+        },
+    },
+});