bug fix and performance improvements

miniprogram/miniprogram_npm/tdesign-miniprogram/button/README.en-US.md

@@ -0,0 +1,148 @@
+:: BASE_DOC ::
+
+## API
+### Button Props
+
+name | type | default | description | required
+-- | -- | -- | -- | --
+block | Boolean | false | make button to be a block-level element | N
+content | String / Slot | - | button's children elements | N
+custom-dataset | Object | - | Typescript：`any` | N
+disabled | Boolean | false | disable the button, make it can not be clicked | N
+external-classes | Array | - | `['t-class', 't-class-icon', 't-class-loading']` | N
+ghost | Boolean | false | make background-color to be transparent | N
+icon | String / Object | - | icon name | N
+loading | Boolean | false | set button to be loading state | N
+loading-props | Object | - | Typescript：`LoadingProps`，[Loading API Documents](./loading?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/button/type.ts) | N
+shape | String | rectangle | button shape。options：rectangle/square/round/circle | N
+size | String | medium | a button has three size。options：small/medium/large。Typescript：`SizeEnum` | N
+suffix | Slot | - | \- | N
+theme | String | default | button theme。options：default/primary/danger | N
+type | String | - | type of button element, same as formType of Miniprogram。options：submit/reset | N
+variant | String | base | button variant。options：base/outline/text | N
+open-type | String | - | options：contact/share/getPhoneNumber/getUserInfo/launchApp/openSetting/feedback/chooseAvatar | N
+hover-stop-propagation | Boolean | false | \- | N
+hover-start-time | Number | 20 | \- | N
+hover-stay-time | Number | 70 | \- | N
+lang | String | en | options：en/zh_CN/zh_TW | N
+session-from | String | - | \- | N
+send-message-title | String | 当前标题 | \- | N
+send-message-path | String | 当前分享路径 | \- | N
+send-message-img | String | 截图 | \- | N
+app-parameter | String | - | \- | N
+show-message-card | Boolean | false | \- | N
+bindgetuserinfo | Eventhandle | - | \- | N
+bindcontact | Eventhandle | - | \- | N
+bindgetphonenumber | Eventhandle | - | \- | N
+binderror | Eventhandle | - | \- | N
+bindopensetting | Eventhandle | - | \- | N
+bindlaunchapp | Eventhandle | - | \- | N
+bindchooseavatar | Eventhandle | - | \- | N
+
+### Button Events
+
+name | params | description
+-- | -- | --
+tap | `(e: MouseEvent)` | trigger on click
+
+
+### CSS Variables
+The component provides the following CSS variables, which can be used to customize styles.
+Name | Default Value | Description 
+-- | -- | --
+--td-button-border-radius | @radius-default | - 
+--td-button-border-width | 4rpx | - 
+--td-button-danger-active-bg-color | @error-color-7 | - 
+--td-button-danger-active-border-color | @error-color-7 | - 
+--td-button-danger-bg-color | @error-color | - 
+--td-button-danger-border-color | @error-color | - 
+--td-button-danger-color | @font-white-1 | - 
+--td-button-danger-dashed-border-color | @button-danger-dashed-color | - 
+--td-button-danger-dashed-color | @error-color | - 
+--td-button-danger-dashed-disabled-color | @button-danger-disabled-color | - 
+--td-button-danger-disabled-bg | @error-color-3 | - 
+--td-button-danger-disabled-border-color | @error-color-3 | - 
+--td-button-danger-disabled-color | @font-white-1 | - 
+--td-button-danger-outline-active-bg-color | @bg-color-container-active | - 
+--td-button-danger-outline-active-border-color | @error-color-7 | - 
+--td-button-danger-outline-border-color | @button-danger-outline-color | - 
+--td-button-danger-outline-color | @error-color | - 
+--td-button-danger-outline-disabled-color | @error-color-3 | - 
+--td-button-danger-text-active-bg-color | @bg-color-container-active | - 
+--td-button-danger-text-color | @error-color | - 
+--td-button-danger-text-disabled-color | @button-danger-disabled-color | - 
+--td-button-default-active-bg-color | @bg-color-component-active | - 
+--td-button-default-active-border-color | @bg-color-component-active | - 
+--td-button-default-bg-color | @bg-color-component | - 
+--td-button-default-border-color | @bg-color-component | - 
+--td-button-default-color | @font-gray-1 | - 
+--td-button-default-disabled-bg | @bg-color-component-disabled | - 
+--td-button-default-disabled-border-color | @bg-color-component-disabled | - 
+--td-button-default-disabled-color | @font-gray-4 | - 
+--td-button-default-outline-active-bg-color | @bg-color-container-active | - 
+--td-button-default-outline-active-border-color | @component-border | - 
+--td-button-default-outline-border-color | @component-border | - 
+--td-button-default-outline-color | @font-gray-1 | - 
+--td-button-default-outline-disabled-color | @component-border | - 
+--td-button-default-text-active-bg-color | @bg-color-container-active | - 
+--td-button-extra-small-font-size | @font-size-base | - 
+--td-button-extra-small-height | 56rpx | - 
+--td-button-extra-small-icon-font-size | 36rpx | - 
+--td-button-extra-small-padding-horizontal | 16rpx | - 
+--td-button-font-weight | 600 | - 
+--td-button-ghost-border-color | @button-ghost-color | - 
+--td-button-ghost-color | @bg-color-container | - 
+--td-button-ghost-danger-border-color | @error-color | - 
+--td-button-ghost-danger-color | @error-color | - 
+--td-button-ghost-disabled-color | rgba(255, 255, 255, 0.35) | - 
+--td-button-ghost-primary-border-color | @brand-color | - 
+--td-button-ghost-primary-color | @brand-color | - 
+--td-button-icon-border-radius | 8rpx | - 
+--td-button-icon-spacer | @spacer | - 
+--td-button-large-font-size | @font-size-m | - 
+--td-button-large-height | 96rpx | - 
+--td-button-large-icon-font-size | 48rpx | - 
+--td-button-large-padding-horizontal | 40rpx | - 
+--td-button-light-active-bg-color | @brand-color-light-active | - 
+--td-button-light-active-border-color | @brand-color-light-active | - 
+--td-button-light-bg-color | @brand-color-light | - 
+--td-button-light-border-color | @brand-color-light | - 
+--td-button-light-color | @brand-color | - 
+--td-button-light-disabled-bg | @brand-color-light | - 
+--td-button-light-disabled-border-color | @brand-color-light | - 
+--td-button-light-disabled-color | @brand-color-disabled | - 
+--td-button-light-outline-active-bg-color | @brand-color-light-active | - 
+--td-button-light-outline-active-border-color | @brand-color-active | - 
+--td-button-light-outline-bg-color | @brand-color-light | - 
+--td-button-light-outline-border-color | @button-light-outline-color | - 
+--td-button-light-outline-color | @brand-color | - 
+--td-button-light-outline-disabled-color | @brand-color-disabled | - 
+--td-button-light-text-active-bg-color | @bg-color-container-active | - 
+--td-button-light-text-color | @brand-color | - 
+--td-button-medium-font-size | @font-size-m | - 
+--td-button-medium-height | 80rpx | - 
+--td-button-medium-icon-font-size | 40rpx | - 
+--td-button-medium-padding-horizontal | 32rpx | - 
+--td-button-primary-active-bg-color | @brand-color-active | - 
+--td-button-primary-active-border-color | @brand-color-active | - 
+--td-button-primary-bg-color | @brand-color | - 
+--td-button-primary-border-color | @brand-color | - 
+--td-button-primary-color | @font-white-1 | - 
+--td-button-primary-dashed-border-color | @button-primary-dashed-color | - 
+--td-button-primary-dashed-color | @brand-color | - 
+--td-button-primary-dashed-disabled-color | @brand-color-disabled | - 
+--td-button-primary-disabled-bg | @brand-color-disabled | - 
+--td-button-primary-disabled-border-color | @brand-color-disabled | - 
+--td-button-primary-disabled-color | @font-white-1 | - 
+--td-button-primary-outline-active-bg-color | @bg-color-container-active | - 
+--td-button-primary-outline-active-border-color | @brand-color-active | - 
+--td-button-primary-outline-border-color | @button-primary-outline-color | - 
+--td-button-primary-outline-color | @brand-color | - 
+--td-button-primary-outline-disabled-color | @brand-color-disabled | - 
+--td-button-primary-text-active-bg-color | @bg-color-container-active | - 
+--td-button-primary-text-color | @brand-color | - 
+--td-button-primary-text-disabled-color | @brand-color-disabled | - 
+--td-button-small-font-size | @font-size-base | - 
+--td-button-small-height | 64rpx | - 
+--td-button-small-icon-font-size | 36rpx | - 
+--td-button-small-padding-horizontal | 24rpx | - 

miniprogram/miniprogram_npm/tdesign-miniprogram/button/README.md

@@ -0,0 +1,214 @@
+---
+title: Button 按钮
+description: 用于开启一个闭环的操作任务，如“删除”对象、“购买”商品等。
+spline: base
+isComponent: true
+---
+
+<span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20lines-100%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20functions-100%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20statements-100%25-blue" /></span><span class="coverages-badge" style="margin-right: 10px"><img src="https://img.shields.io/badge/coverages%3A%20branches-83%25-blue" /></span>
+## 引入
+
+全局引入，在 miniprogram 根目录下的`app.json`中配置，局部引入，在需要引入的页面或组件的`index.json`中配置。
+
+```json
+"usingComponents": {
+  "t-button": "tdesign-miniprogram/button/button"
+}
+```
+
+## 代码演示
+
+### 01 组件类型
+
+基础按钮
+
+{{ base }}
+
+图标按钮
+
+{{ icon-btn }}
+
+幽灵按钮
+
+{{ ghost-btn }}
+
+组合按钮
+
+{{ group-btn }}
+
+通栏按钮
+
+{{ block-btn }}
+
+### 02 组件状态
+
+按钮禁用态
+
+{{ disabled }}
+
+### 03 组件样式
+
+按钮尺寸
+
+{{ size }}
+
+按钮形状
+
+{{ shape }}
+
+按钮主题
+
+{{ theme }}
+
+## API
+### Button Props
+
+名称 | 类型 | 默认值 | 说明 | 必传
+-- | -- | -- | -- | --
+block | Boolean | false | 是否为块级元素 | N
+content | String / Slot | - | 按钮内容 | N
+custom-dataset | Object | - | 自定义 dataset，可通过 event.currentTarget.dataset.custom 获取。TS 类型：`any` | N
+disabled | Boolean | false | 禁用状态 | N
+ghost | Boolean | false | 是否为幽灵按钮（镂空按钮） | N
+icon | String / Object | - | 图标名称。值为字符串表示图标名称，值为 `Object` 类型，表示透传至 `icon`。 | N
+loading | Boolean | false | 是否显示为加载状态 | N
+loading-props | Object | - | 透传至 Loading 组件。TS 类型：`LoadingProps`，[Loading API Documents](./loading?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/button/type.ts) | N
+shape | String | rectangle | 按钮形状，有 4 种：长方形、正方形、圆角长方形、圆形。可选项：rectangle/square/round/circle | N
+size | String | medium | 组件尺寸。可选项：extra-small/small/medium/large。TS 类型：`SizeEnum` | N
+suffix | Slot | - | 右侧内容，可用于定义右侧图标 | N
+theme | String | default | 组件风格，依次为品牌色、危险色。可选项：default/primary/danger/light | N
+type | String | - | 同小程序的 formType。可选项：submit/reset | N
+variant | String | base | 按钮形式，基础、线框、文字。可选项：base/outline/dashed/text | N
+open-type | String | - | 微信开放能力。<br />具体释义：<br />`contact` 打开客服会话，如果用户在会话中点击消息卡片后返回小程序，可以从 bindcontact 回调中获得具体信息，<a href="https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/customer-message/customer-message.html">具体说明</a> （*小程序插件中不能使用*）；<br />`share` 触发用户转发，使用前建议先阅读<a href="https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share.html#使用指引">使用指引</a>；<br />`getPhoneNumber` 获取用户手机号，可以从 bindgetphonenumber 回调中获取到用户信息，<a href="https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNumber.html">具体说明</a> （*小程序插件中不能使用*）；<br />`getUserInfo` 获取用户信息，可以从 bindgetuserinfo 回调中获取到用户信息 （*小程序插件中不能使用*）；<br />`launchApp` 打开APP，可以通过 app-parameter 属性设定向 APP 传的参数<a href="https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/launchApp.html">具体说明</a>；<br />`openSetting` 打开授权设置页；<br />`feedback` 打开“意见反馈”页面，用户可提交反馈内容并上传<a href="https://developers.weixin.qq.com/miniprogram/dev/api/base/debug/wx.getLogManager.html">日志</a>，开发者可以登录<a href="https://mp.weixin.qq.com/">小程序管理后台</a>后进入左侧菜单“客服反馈”页面获取到反馈内容；<br />`chooseAvatar` 获取用户头像，可以从 bindchooseavatar 回调中获取到头像信息。<br />[小程序官方文档](https://developers.weixin.qq.com/miniprogram/dev/component/button.html)。可选项：contact/share/getPhoneNumber/getUserInfo/launchApp/openSetting/feedback/chooseAvatar | N
+hover-class | String | '' | 指定按钮按下去的样式类，按钮不为加载或禁用状态时有效。当 `hover-class="none"` 时，没有点击态效果 | N
+hover-stop-propagation | Boolean | false | 指定是否阻止本节点的祖先节点出现点击态 | N
+hover-start-time | Number | 20 | 按住后多久出现点击态，单位毫秒 | N
+hover-stay-time | Number | 70 | 手指松开后点击态保留时间，单位毫秒 | N
+lang | String | en | 指定返回用户信息的语言，zh_CN 简体中文，zh_TW 繁体中文，en 英文。。<br />具体释义：<br />`en` 英文；<br />`zh_CN` 简体中文；<br />`zh_TW` 繁体中文。<br />[小程序官方文档](https://developers.weixin.qq.com/miniprogram/dev/component/button.html)。可选项：en/zh_CN/zh_TW | N
+session-from | String | - | 会话来源，open-type="contact"时有效 | N
+send-message-title | String | 当前标题 | 会话内消息卡片标题，open-type="contact"时有效 | N
+send-message-path | String | 当前分享路径 | 会话内消息卡片点击跳转小程序路径，open-type="contact"时有效 | N
+send-message-img | String | 截图 | 会话内消息卡片图片，open-type="contact"时有效 | N
+app-parameter | String | - | 打开 APP 时，向 APP 传递的参数，open-type=launchApp时有效 | N
+show-message-card | Boolean | false | 是否显示会话内消息卡片，设置此参数为 true，用户进入客服会话会在右下角显示"可能要发送的小程序"提示，用户点击后可以快速发送小程序消息，open-type="contact"时有效 | N
+bindgetuserinfo | Eventhandle | - | 用户点击该按钮时，会返回获取到的用户信息，回调的 detail 数据与<a href="https://developers.weixin.qq.com/miniprogram/dev/api/open-api/user-info/wx.getUserInfo.html">wx.getUserInfo</a>返回的一致，open-type="getUserInfo"时有效 | N
+bindcontact | Eventhandle | - | 客服消息回调，open-type="contact"时有效 | N
+bindgetphonenumber | Eventhandle | - | 获取用户手机号回调，open-type=getPhoneNumber时有效 | N
+binderror | Eventhandle | - | 当使用开放能力时，发生错误的回调，open-type=launchApp时有效 | N
+bindopensetting | Eventhandle | - | 在打开授权设置页后回调，open-type=openSetting时有效 | N
+bindlaunchapp | Eventhandle | - | 打开 APP 成功的回调，open-type=launchApp时有效 | N
+bindchooseavatar | Eventhandle | - | 获取用户头像回调，open-type=chooseAvatar时有效 | N
+
+### Button Events
+
+名称 | 参数 | 描述
+-- | -- | --
+tap | `event` | 点击按钮，当按钮不为加载或禁用状态时触发
+
+### Button 外部样式类
+类名 | 说明
+-- | -- 
+t-class | 根节点样式类
+t-class-icon | 图标样式类
+t-class-loading | 加载样式类
+
+### CSS 变量
+组件提供了下列 CSS 变量，可用于自定义样式。
+名称 | 默认值 | 描述 
+-- | -- | --
+--td-button-border-radius | @radius-default | - 
+--td-button-border-width | 4rpx | - 
+--td-button-danger-active-bg-color | @error-color-7 | - 
+--td-button-danger-active-border-color | @error-color-7 | - 
+--td-button-danger-bg-color | @error-color | - 
+--td-button-danger-border-color | @error-color | - 
+--td-button-danger-color | @font-white-1 | - 
+--td-button-danger-dashed-border-color | @button-danger-dashed-color | - 
+--td-button-danger-dashed-color | @error-color | - 
+--td-button-danger-dashed-disabled-color | @button-danger-disabled-color | - 
+--td-button-danger-disabled-bg | @error-color-3 | - 
+--td-button-danger-disabled-border-color | @error-color-3 | - 
+--td-button-danger-disabled-color | @font-white-1 | - 
+--td-button-danger-outline-active-bg-color | @bg-color-container-active | - 
+--td-button-danger-outline-active-border-color | @error-color-7 | - 
+--td-button-danger-outline-border-color | @button-danger-outline-color | - 
+--td-button-danger-outline-color | @error-color | - 
+--td-button-danger-outline-disabled-color | @error-color-3 | - 
+--td-button-danger-text-active-bg-color | @bg-color-container-active | - 
+--td-button-danger-text-color | @error-color | - 
+--td-button-danger-text-disabled-color | @button-danger-disabled-color | - 
+--td-button-default-active-bg-color | @bg-color-component-active | - 
+--td-button-default-active-border-color | @bg-color-component-active | - 
+--td-button-default-bg-color | @bg-color-component | - 
+--td-button-default-border-color | @bg-color-component | - 
+--td-button-default-color | @font-gray-1 | - 
+--td-button-default-disabled-bg | @bg-color-component-disabled | - 
+--td-button-default-disabled-border-color | @bg-color-component-disabled | - 
+--td-button-default-disabled-color | @font-gray-4 | - 
+--td-button-default-outline-active-bg-color | @bg-color-container-active | - 
+--td-button-default-outline-active-border-color | @component-border | - 
+--td-button-default-outline-border-color | @component-border | - 
+--td-button-default-outline-color | @font-gray-1 | - 
+--td-button-default-outline-disabled-color | @component-border | - 
+--td-button-default-text-active-bg-color | @bg-color-container-active | - 
+--td-button-extra-small-font-size | @font-size-base | - 
+--td-button-extra-small-height | 56rpx | - 
+--td-button-extra-small-icon-font-size | 36rpx | - 
+--td-button-extra-small-padding-horizontal | 16rpx | - 
+--td-button-font-weight | 600 | - 
+--td-button-ghost-border-color | @button-ghost-color | - 
+--td-button-ghost-color | @bg-color-container | - 
+--td-button-ghost-danger-border-color | @error-color | - 
+--td-button-ghost-danger-color | @error-color | - 
+--td-button-ghost-disabled-color | rgba(255, 255, 255, 0.35) | - 
+--td-button-ghost-primary-border-color | @brand-color | - 
+--td-button-ghost-primary-color | @brand-color | - 
+--td-button-icon-border-radius | 8rpx | - 
+--td-button-icon-spacer | @spacer | - 
+--td-button-large-font-size | @font-size-m | - 
+--td-button-large-height | 96rpx | - 
+--td-button-large-icon-font-size | 48rpx | - 
+--td-button-large-padding-horizontal | 40rpx | - 
+--td-button-light-active-bg-color | @brand-color-light-active | - 
+--td-button-light-active-border-color | @brand-color-light-active | - 
+--td-button-light-bg-color | @brand-color-light | - 
+--td-button-light-border-color | @brand-color-light | - 
+--td-button-light-color | @brand-color | - 
+--td-button-light-disabled-bg | @brand-color-light | - 
+--td-button-light-disabled-border-color | @brand-color-light | - 
+--td-button-light-disabled-color | @brand-color-disabled | - 
+--td-button-light-outline-active-bg-color | @brand-color-light-active | - 
+--td-button-light-outline-active-border-color | @brand-color-active | - 
+--td-button-light-outline-bg-color | @brand-color-light | - 
+--td-button-light-outline-border-color | @button-light-outline-color | - 
+--td-button-light-outline-color | @brand-color | - 
+--td-button-light-outline-disabled-color | @brand-color-disabled | - 
+--td-button-light-text-active-bg-color | @bg-color-container-active | - 
+--td-button-light-text-color | @brand-color | - 
+--td-button-medium-font-size | @font-size-m | - 
+--td-button-medium-height | 80rpx | - 
+--td-button-medium-icon-font-size | 40rpx | - 
+--td-button-medium-padding-horizontal | 32rpx | - 
+--td-button-primary-active-bg-color | @brand-color-active | - 
+--td-button-primary-active-border-color | @brand-color-active | - 
+--td-button-primary-bg-color | @brand-color | - 
+--td-button-primary-border-color | @brand-color | - 
+--td-button-primary-color | @font-white-1 | - 
+--td-button-primary-dashed-border-color | @button-primary-dashed-color | - 
+--td-button-primary-dashed-color | @brand-color | - 
+--td-button-primary-dashed-disabled-color | @brand-color-disabled | - 
+--td-button-primary-disabled-bg | @brand-color-disabled | - 
+--td-button-primary-disabled-border-color | @brand-color-disabled | - 
+--td-button-primary-disabled-color | @font-white-1 | - 
+--td-button-primary-outline-active-bg-color | @bg-color-container-active | - 
+--td-button-primary-outline-active-border-color | @brand-color-active | - 
+--td-button-primary-outline-border-color | @button-primary-outline-color | - 
+--td-button-primary-outline-color | @brand-color | - 
+--td-button-primary-outline-disabled-color | @brand-color-disabled | - 
+--td-button-primary-text-active-bg-color | @bg-color-container-active | - 
+--td-button-primary-text-color | @brand-color | - 
+--td-button-primary-text-disabled-color | @brand-color-disabled | - 
+--td-button-small-font-size | @font-size-base | - 
+--td-button-small-height | 64rpx | - 
+--td-button-small-icon-font-size | 36rpx | - 
+--td-button-small-padding-horizontal | 24rpx | - 

miniprogram/miniprogram_npm/tdesign-miniprogram/button/button.d.ts

@@ -0,0 +1,35 @@
+import { SuperComponent } from '../common/src/index';
+import type { TdButtonProps } from './type';
+export interface ButtonProps extends TdButtonProps {
+}
+export default class Button extends SuperComponent {
+    externalClasses: string[];
+    behaviors: string[];
+    properties: TdButtonProps;
+    options: {
+        multipleSlots: boolean;
+    };
+    data: {
+        prefix: string;
+        className: string;
+        classPrefix: string;
+    };
+    observers: {
+        'theme, size, plain, block, shape, disabled, loading, variant'(): void;
+        icon(icon: any): void;
+    };
+    lifetimes: {
+        attached(): void;
+    };
+    methods: {
+        setClass(): void;
+        getuserinfo(e: any): void;
+        contact(e: any): void;
+        getphonenumber(e: any): void;
+        error(e: any): void;
+        opensetting(e: any): void;
+        launchapp(e: any): void;
+        chooseavatar(e: any): void;
+        handleTap(e: any): void;
+    };
+}

miniprogram/miniprogram_npm/tdesign-miniprogram/button/button.js

@@ -0,0 +1,97 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { SuperComponent, wxComponent } from '../common/src/index';
+import config from '../common/config';
+import props from './props';
+import { canIUseFormFieldButton } from '../common/version';
+import { setIcon } from '../common/utils';
+const { prefix } = config;
+const name = `${prefix}-button`;
+let Button = class Button extends SuperComponent {
+    constructor() {
+        super(...arguments);
+        this.externalClasses = [`${prefix}-class`, `${prefix}-class-icon`, `${prefix}-class-loading`];
+        this.behaviors = canIUseFormFieldButton() ? ['wx://form-field-button'] : [];
+        this.properties = props;
+        this.options = {
+            multipleSlots: true,
+        };
+        this.data = {
+            prefix,
+            className: '',
+            classPrefix: name,
+        };
+        this.observers = {
+            'theme, size, plain, block, shape, disabled, loading, variant'() {
+                this.setClass();
+            },
+            icon(icon) {
+                const obj = setIcon('icon', icon, '');
+                this.setData(Object.assign({}, obj));
+            },
+        };
+        this.lifetimes = {
+            attached() {
+                this.setClass();
+            },
+        };
+        this.methods = {
+            setClass() {
+                const classList = [
+                    name,
+                    `${prefix}-class`,
+                    `${name}--${this.data.variant || 'base'}`,
+                    `${name}--${this.data.theme || 'default'}`,
+                    `${name}--${this.data.shape || 'rectangle'}`,
+                    `${name}--size-${this.data.size || 'medium'}`,
+                ];
+                if (this.data.block) {
+                    classList.push(`${name}--block`);
+                }
+                if (this.data.disabled) {
+                    classList.push(`${name}--disabled`);
+                }
+                if (this.data.ghost) {
+                    classList.push(`${name}--ghost`);
+                }
+                this.setData({
+                    className: classList.join(' '),
+                });
+            },
+            getuserinfo(e) {
+                this.triggerEvent('getuserinfo', e.detail);
+            },
+            contact(e) {
+                this.triggerEvent('contact', e.detail);
+            },
+            getphonenumber(e) {
+                this.triggerEvent('getphonenumber', e.detail);
+            },
+            error(e) {
+                this.triggerEvent('error', e.detail);
+            },
+            opensetting(e) {
+                this.triggerEvent('opensetting', e.detail);
+            },
+            launchapp(e) {
+                this.triggerEvent('launchapp', e.detail);
+            },
+            chooseavatar(e) {
+                this.triggerEvent('chooseavatar', e.detail);
+            },
+            handleTap(e) {
+                if (this.data.disabled || this.data.loading)
+                    return;
+                this.triggerEvent('tap', e);
+            },
+        };
+    }
+};
+Button = __decorate([
+    wxComponent()
+], Button);
+export default Button;

miniprogram/miniprogram_npm/tdesign-miniprogram/button/button.json

@@ -0,0 +1,7 @@
+{
+  "component": true,
+  "usingComponents": {
+    "t-icon": "../icon/icon",
+    "t-loading": "../loading/loading"
+  }
+}

miniprogram/miniprogram_npm/tdesign-miniprogram/button/button.wxml

@@ -0,0 +1,59 @@
+<import src="../common/template/icon.wxml" />
+<wxs src="../common/utils.wxs" module="_" />
+
+<button
+  style="{{_._style([style, customStyle])}}"
+  data-custom="{{ customDataset }}"
+  class="class {{className}}"
+  form-type="{{disabled || loading ? '' : type}}"
+  open-type="{{disabled || loading ? '' : openType}}"
+  hover-stop-propagation="{{hoverStopPropagation}}"
+  hover-start-time="{{hoverStartTime}}"
+  hover-stay-time="{{hoverStayTime}}"
+  lang="{{lang}}"
+  session-from="{{sessionFrom}}"
+  hover-class="{{disabled || loading ? '' : (hoverClass || classPrefix + '--hover')}}"
+  send-message-title="{{sendMessageTitle}}"
+  send-message-path="{{sendMessagePath}}"
+  send-message-img="{{sendMessageImg}}"
+  app-parameter="{{appParameter}}"
+  show-message-card="{{showMessageCard}}"
+  catch:tap="handleTap"
+  bind:getuserinfo="getuserinfo"
+  bind:contact="contact"
+  bind:getphonenumber="getphonenumber"
+  bind:error="error"
+  bind:opensetting="opensetting"
+  bind:launchapp="launchapp"
+  bind:chooseavatar="chooseavatar"
+  aria-label="{{ariaLabel}}"
+>
+  <template
+    wx:if="{{iconName || _.isNoEmptyObj(iconData)}}"
+    is="icon"
+    data="{{class: classPrefix + '__icon', tClass: prefix + '-class-icon', ariaHidden: true, name: iconName, ...iconData}}"
+  />
+  <t-loading
+    wx:if="{{loading}}"
+    delay="{{loadingProps.delay || 0}}"
+    duration="{{loadingProps.duration || 800}}"
+    indicator="{{loadingProps.indicator || true}}"
+    inheritColor="{{loadingProps.inheritColor || true}}"
+    layout="{{loadingProps.layout || 'horizontal'}}"
+    pause="{{loadingProps.pause || false}}"
+    progress="{{loadingProps.progress || 0}}"
+    reverse="{{loadingProps.reverse || false}}"
+    size="{{loadingProps.size || '40rpx'}}"
+    text="{{loadingProps.text || '' }}"
+    theme="{{loadingProps.theme || 'circular'}}"
+    loading
+    t-class="{{classPrefix}}__loading {{classPrefix}}__loading--wrapper"
+    t-class-indicator="{{classPrefix}}__loading--indicator {{prefix}}-class-loading"
+  />
+  <view class="{{classPrefix}}__content">
+    <slot name="content" />
+    <block>{{content}}</block>
+    <slot />
+  </view>
+  <slot name="suffix" />
+</button>

miniprogram/miniprogram_npm/tdesign-miniprogram/button/button.wxss

@@ -0,0 +1,448 @@
+.t-float-left {
+  float: left;
+}
+.t-float-right {
+  float: right;
+}
+@keyframes tdesign-fade-out {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}
+.hotspot-expanded.relative {
+  position: relative;
+}
+.hotspot-expanded::after {
+  content: '';
+  display: block;
+  position: absolute;
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  transform: scale(1.5);
+}
+.t-button--size-extra-small {
+  font-size: var(--td-button-extra-small-font-size, var(--td-font-size-base, 28rpx));
+  padding-left: var(--td-button-extra-small-padding-horizontal, 16rpx);
+  padding-right: var(--td-button-extra-small-padding-horizontal, 16rpx);
+  height: var(--td-button-extra-small-height, 56rpx);
+  line-height: var(--td-button-extra-small-height, 56rpx);
+}
+.t-button--size-extra-small .t-button__icon {
+  font-size: var(--td-button-extra-small-icon-font-size, 36rpx);
+}
+.t-button--size-small {
+  font-size: var(--td-button-small-font-size, var(--td-font-size-base, 28rpx));
+  padding-left: var(--td-button-small-padding-horizontal, 24rpx);
+  padding-right: var(--td-button-small-padding-horizontal, 24rpx);
+  height: var(--td-button-small-height, 64rpx);
+  line-height: var(--td-button-small-height, 64rpx);
+}
+.t-button--size-small .t-button__icon {
+  font-size: var(--td-button-small-icon-font-size, 36rpx);
+}
+.t-button--size-medium {
+  font-size: var(--td-button-medium-font-size, var(--td-font-size-m, 32rpx));
+  padding-left: var(--td-button-medium-padding-horizontal, 32rpx);
+  padding-right: var(--td-button-medium-padding-horizontal, 32rpx);
+  height: var(--td-button-medium-height, 80rpx);
+  line-height: var(--td-button-medium-height, 80rpx);
+}
+.t-button--size-medium .t-button__icon {
+  font-size: var(--td-button-medium-icon-font-size, 40rpx);
+}
+.t-button--size-large {
+  font-size: var(--td-button-large-font-size, var(--td-font-size-m, 32rpx));
+  padding-left: var(--td-button-large-padding-horizontal, 40rpx);
+  padding-right: var(--td-button-large-padding-horizontal, 40rpx);
+  height: var(--td-button-large-height, 96rpx);
+  line-height: var(--td-button-large-height, 96rpx);
+}
+.t-button--size-large .t-button__icon {
+  font-size: var(--td-button-large-icon-font-size, 48rpx);
+}
+.t-button--default {
+  color: var(--td-button-default-color, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
+  background-color: var(--td-button-default-bg-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
+}
+.t-button--default::after {
+  border-width: var(--td-button-border-width, 4rpx);
+  border-color: var(--td-button-default-border-color, var(--td-bg-color-component, var(--td-gray-color-3, #e7e7e7)));
+}
+.t-button--default.t-button--hover {
+  z-index: 0;
+}
+.t-button--default.t-button--hover::after {
+  background-color: var(--td-button-default-active-bg-color, var(--td-bg-color-component-active, var(--td-gray-color-6, #a6a6a6)));
+  border-color: var(--td-button-default-active-border-color, var(--td-bg-color-component-active, var(--td-gray-color-6, #a6a6a6)));
+}
+.t-button--default.t-button--disabled {
+  color: var(--td-button-default-disabled-color, var(--td-font-gray-4, rgba(0, 0, 0, 0.26)));
+  background-color: var(--td-button-default-disabled-bg, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
+}
+.t-button--default.t-button--disabled::after {
+  border-color: var(--td-button-default-disabled-border-color, var(--td-bg-color-component-disabled, var(--td-gray-color-2, #eeeeee)));
+}
+.t-button--primary {
+  color: var(--td-button-primary-color, var(--td-font-white-1, #ffffff));
+  background-color: var(--td-button-primary-bg-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
+}
+.t-button--primary::after {
+  border-width: var(--td-button-border-width, 4rpx);
+  border-color: var(--td-button-primary-border-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
+}
+.t-button--primary.t-button--hover {
+  z-index: 0;
+}
+.t-button--primary.t-button--hover::after {
+  background-color: var(--td-button-primary-active-bg-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
+  border-color: var(--td-button-primary-active-border-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
+}
+.t-button--primary.t-button--disabled {
+  color: var(--td-button-primary-disabled-color, var(--td-font-white-1, #ffffff));
+  background-color: var(--td-button-primary-disabled-bg, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
+}
+.t-button--primary.t-button--disabled::after {
+  border-color: var(--td-button-primary-disabled-border-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
+}
+.t-button--light {
+  color: var(--td-button-light-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
+  background-color: var(--td-button-light-bg-color, var(--td-brand-color-light, var(--td-primary-color-1, #f2f3ff)));
+}
+.t-button--light::after {
+  border-width: var(--td-button-border-width, 4rpx);
+  border-color: var(--td-button-light-border-color, var(--td-brand-color-light, var(--td-primary-color-1, #f2f3ff)));
+}
+.t-button--light.t-button--hover {
+  z-index: 0;
+}
+.t-button--light.t-button--hover::after {
+  background-color: var(--td-button-light-active-bg-color, var(--td-brand-color-light-active, var(--td-primary-color-2, #d9e1ff)));
+  border-color: var(--td-button-light-active-border-color, var(--td-brand-color-light-active, var(--td-primary-color-2, #d9e1ff)));
+}
+.t-button--light.t-button--disabled {
+  color: var(--td-button-light-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
+  background-color: var(--td-button-light-disabled-bg, var(--td-brand-color-light, var(--td-primary-color-1, #f2f3ff)));
+}
+.t-button--light.t-button--disabled::after {
+  border-color: var(--td-button-light-disabled-border-color, var(--td-brand-color-light, var(--td-primary-color-1, #f2f3ff)));
+}
+.t-button--danger {
+  color: var(--td-button-danger-color, var(--td-font-white-1, #ffffff));
+  background-color: var(--td-button-danger-bg-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
+}
+.t-button--danger::after {
+  border-width: var(--td-button-border-width, 4rpx);
+  border-color: var(--td-button-danger-border-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
+}
+.t-button--danger.t-button--hover {
+  z-index: 0;
+}
+.t-button--danger.t-button--hover::after {
+  background-color: var(--td-button-danger-active-bg-color, var(--td-error-color-7, #ad352f));
+  border-color: var(--td-button-danger-active-border-color, var(--td-error-color-7, #ad352f));
+}
+.t-button--danger.t-button--disabled {
+  color: var(--td-button-danger-disabled-color, var(--td-font-white-1, #ffffff));
+  background-color: var(--td-button-danger-disabled-bg, var(--td-error-color-3, #ffb9b0));
+}
+.t-button--danger.t-button--disabled::after {
+  border-color: var(--td-button-danger-disabled-border-color, var(--td-error-color-3, #ffb9b0));
+}
+.t-button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  white-space: nowrap;
+  text-align: center;
+  background-image: none;
+  transition: all 0.3s;
+  touch-action: manipulation;
+  border-radius: var(--td-button-border-radius, var(--td-radius-default, 12rpx));
+  outline: none;
+  font-family: PingFang SC, Microsoft YaHei, Arial Regular;
+  font-weight: var(--td-button-font-weight, 600);
+  vertical-align: top;
+  cursor: pointer;
+  -webkit-tap-highlight-color: transparent;
+  -webkit-user-select: none;
+  user-select: none;
+  /* stylelint-disable-next-line */
+  -webkit-appearance: none;
+}
+.t-button::after {
+  border-radius: calc(var(--td-button-border-radius, var(--td-radius-default, 12rpx)) * 2);
+}
+.t-button--text {
+  color: var(--td-button-default-color, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
+  background: none;
+}
+.t-button--text::after {
+  border: 0;
+}
+.t-button--text.t-button--hover::after {
+  background-color: var(--td-button-default-text-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
+}
+.t-button--text.t-button--primary {
+  color: var(--td-button-primary-text-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
+  background: none;
+}
+.t-button--text.t-button--primary.t-button--hover::after {
+  background-color: var(--td-button-primary-text-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
+}
+.t-button--text.t-button--primary.t-button--disabled {
+  color: var(--td-button-primary-text-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
+  background: none;
+}
+.t-button--text.t-button--danger {
+  color: var(--td-button-danger-text-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
+  background: none;
+}
+.t-button--text.t-button--danger.t-button--hover::after {
+  background-color: var(--td-button-danger-text-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
+}
+.t-button--text.t-button--danger.t-button--disabled {
+  color: var(--td-button-danger-text-disabled-color, var(--td-button-danger-disabled-color, var(--td-font-white-1, #ffffff)));
+  background: none;
+}
+.t-button--text.t-button--light {
+  color: var(--td-button-light-text-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
+  background: none;
+}
+.t-button--text.t-button--light.t-button--hover::after {
+  background-color: var(--td-button-light-text-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
+}
+.t-button--text.t-button--disabled {
+  color: var(--td-button-default-disabled-color, var(--td-font-gray-4, rgba(0, 0, 0, 0.26)));
+}
+.t-button--ghost {
+  background-color: transparent;
+  color: var(--td-button-ghost-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff)));
+}
+.t-button--ghost::after {
+  border-color: var(--td-button-ghost-border-color, var(--td-button-ghost-color, var(--td-bg-color-container, var(--td-font-white-1, #ffffff))));
+}
+.t-button--ghost.t-button--hover::after {
+  background: none;
+}
+.t-button--ghost.t-button--primary {
+  color: var(--td-button-ghost-primary-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
+}
+.t-button--ghost.t-button--primary::after {
+  border-color: var(--td-button-ghost-primary-border-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
+}
+.t-button--ghost.t-button--danger {
+  color: var(--td-button-ghost-danger-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
+}
+.t-button--ghost.t-button--danger::after {
+  border-color: var(--td-button-ghost-danger-border-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
+}
+.t-button--ghost.t-button--disabled {
+  background-color: transparent;
+  color: var(--td-button-ghost-disabled-color, rgba(255, 255, 255, 0.35));
+}
+.t-button--ghost.t-button--disabled::after {
+  border-color: var(--td-button-ghost-disabled-color, rgba(255, 255, 255, 0.35));
+}
+.t-button--outline {
+  color: var(--td-button-default-outline-color, var(--td-font-gray-1, rgba(0, 0, 0, 0.9)));
+  background-color: transparent;
+}
+.t-button--outline::after {
+  border-color: var(--td-button-default-outline-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
+}
+.t-button--outline.t-button--hover::after {
+  background-color: var(--td-button-default-outline-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
+  border-color: var(--td-button-default-outline-active-border-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
+}
+.t-button--outline.t-button--disabled {
+  color: var(--td-button-default-outline-disabled-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
+}
+.t-button--outline.t-button--disabled::after {
+  border-color: var(--td-button-default-outline-disabled-color, var(--td-component-border, var(--td-gray-color-4, #dcdcdc)));
+}
+.t-button--outline.t-button--primary {
+  color: var(--td-button-primary-outline-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
+}
+.t-button--outline.t-button--primary::after {
+  border-color: var(--td-button-primary-outline-border-color, var(--td-button-primary-outline-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9))));
+}
+.t-button--outline.t-button--primary.t-button--hover {
+  color: var(--td-button-primary-outline-active-border-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
+}
+.t-button--outline.t-button--primary.t-button--hover::after {
+  background-color: var(--td-button-primary-outline-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
+  border-color: var(--td-button-primary-outline-active-border-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
+}
+.t-button--outline.t-button--primary.t-button--disabled {
+  background-color: transparent;
+  color: var(--td-button-primary-outline-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
+}
+.t-button--outline.t-button--primary.t-button--disabled::after {
+  border-color: var(--td-button-primary-outline-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
+}
+.t-button--outline.t-button--danger {
+  color: var(--td-button-danger-outline-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
+}
+.t-button--outline.t-button--danger::after {
+  border-color: var(--td-button-danger-outline-border-color, var(--td-button-danger-outline-color, var(--td-error-color, var(--td-error-color-6, #d54941))));
+}
+.t-button--outline.t-button--danger.t-button--hover {
+  color: var(--td-button-danger-outline-active-border-color, var(--td-error-color-7, #ad352f));
+}
+.t-button--outline.t-button--danger.t-button--hover::after {
+  background-color: var(--td-button-danger-outline-active-bg-color, var(--td-bg-color-container-active, var(--td-gray-color-3, #e7e7e7)));
+  border-color: var(--td-button-danger-outline-active-border-color, var(--td-error-color-7, #ad352f));
+}
+.t-button--outline.t-button--danger.t-button--disabled {
+  background-color: transparent;
+  color: var(--td-button-danger-outline-disabled-color, var(--td-error-color-3, #ffb9b0));
+}
+.t-button--outline.t-button--danger.t-button--disabled::after {
+  border-color: var(--td-button-danger-outline-disabled-color, var(--td-error-color-3, #ffb9b0));
+}
+.t-button--outline.t-button--light {
+  color: var(--td-button-light-outline-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
+  background-color: var(--td-button-light-outline-bg-color, var(--td-brand-color-light, var(--td-primary-color-1, #f2f3ff)));
+}
+.t-button--outline.t-button--light::after {
+  border-color: var(--td-button-light-outline-border-color, var(--td-button-light-outline-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9))));
+}
+.t-button--outline.t-button--light.t-button--hover {
+  color: var(--td-button-light-outline-active-border-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
+}
+.t-button--outline.t-button--light.t-button--hover::after {
+  background-color: var(--td-button-light-outline-active-bg-color, var(--td-brand-color-light-active, var(--td-primary-color-2, #d9e1ff)));
+  border-color: var(--td-button-light-outline-active-border-color, var(--td-brand-color-active, var(--td-primary-color-8, #003cab)));
+}
+.t-button--outline.t-button--light.t-button--disabled {
+  background-color: transparent;
+  color: var(--td-button-light-outline-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
+}
+.t-button--outline.t-button--light.t-button--disabled::after {
+  border-color: var(--td-button-light-outline-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
+}
+.t-button--dashed {
+  background-color: transparent;
+  border-style: dashed;
+}
+.t-button--dashed.t-button--primary {
+  color: var(--td-button-primary-dashed-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9)));
+}
+.t-button--dashed.t-button--primary::after {
+  border-color: var(--td-button-primary-dashed-border-color, var(--td-button-primary-dashed-color, var(--td-brand-color, var(--td-primary-color-7, #0052d9))));
+}
+.t-button--dashed.t-button--primary.t-button--disabled {
+  background-color: transparent;
+  color: var(--td-button-primary-dashed-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
+}
+.t-button--dashed.t-button--primary.t-button--disabled::after {
+  border-color: var(--td-button-primary-dashed-disabled-color, var(--td-brand-color-disabled, var(--td-primary-color-3, #b5c7ff)));
+}
+.t-button--dashed.t-button--danger {
+  color: var(--td-button-danger-dashed-color, var(--td-error-color, var(--td-error-color-6, #d54941)));
+}
+.t-button--dashed.t-button--danger::after {
+  border-color: var(--td-button-danger-dashed-border-color, var(--td-button-danger-dashed-color, var(--td-error-color, var(--td-error-color-6, #d54941))));
+}
+.t-button--dashed.t-button--danger.t-button--disabled {
+  background-color: transparent;
+  color: var(--td-button-danger-dashed-disabled-color, var(--td-button-danger-disabled-color, var(--td-font-white-1, #ffffff)));
+}
+.t-button--dashed.t-button--danger.t-button--disabled::after {
+  border-color: var(--td-button-danger-dashed-disabled-color, var(--td-button-danger-disabled-color, var(--td-font-white-1, #ffffff)));
+}
+.t-button__loading + .t-button__content:not(:empty),
+.t-button__icon + .t-button__content:not(:empty) {
+  margin-left: 8rpx;
+}
+.t-button__icon {
+  border-radius: var(--td-button-icon-border-radius, 8rpx);
+}
+.t-button--round.t-button--size-large {
+  border-radius: calc(var(--td-button-large-height, 96rpx) / 2);
+}
+.t-button--round.t-button--size-large::after {
+  border-radius: var(--td-button-large-height, 96rpx);
+}
+.t-button--round.t-button--size-medium {
+  border-radius: calc(var(--td-button-medium-height, 80rpx) / 2);
+}
+.t-button--round.t-button--size-medium::after {
+  border-radius: var(--td-button-medium-height, 80rpx);
+}
+.t-button--round.t-button--size-small {
+  border-radius: calc(var(--td-button-small-height, 64rpx) / 2);
+}
+.t-button--round.t-button--size-small::after {
+  border-radius: var(--td-button-small-height, 64rpx);
+}
+.t-button--round.t-button--size-extra-small {
+  border-radius: calc(var(--td-button-extra-small-height, 56rpx) / 2);
+}
+.t-button--round.t-button--size-extra-small::after {
+  border-radius: var(--td-button-extra-small-height, 56rpx);
+}
+.t-button--square {
+  padding: 0;
+}
+.t-button--square.t-button--size-large {
+  width: var(--td-button-large-height, 96rpx);
+}
+.t-button--square.t-button--size-medium {
+  width: var(--td-button-medium-height, 80rpx);
+}
+.t-button--square.t-button--size-small {
+  width: var(--td-button-small-height, 64rpx);
+}
+.t-button--square.t-button--size-extra-small {
+  width: var(--td-button-extra-small-height, 56rpx);
+}
+.t-button--circle {
+  padding: 0;
+  border-radius: 50%;
+}
+.t-button--circle.t-button--size-large {
+  width: var(--td-button-large-height, 96rpx);
+}
+.t-button--circle.t-button--size-large::after {
+  border-radius: 50%;
+}
+.t-button--circle.t-button--size-medium {
+  width: var(--td-button-medium-height, 80rpx);
+}
+.t-button--circle.t-button--size-medium::after {
+  border-radius: 50%;
+}
+.t-button--circle.t-button--size-small {
+  width: var(--td-button-small-height, 64rpx);
+}
+.t-button--circle.t-button--size-small::after {
+  border-radius: 50%;
+}
+.t-button--circle.t-button--size-extra-small {
+  width: var(--td-button-extra-small-height, 56rpx);
+}
+.t-button--circle.t-button--size-extra-small::after {
+  border-radius: 50%;
+}
+.t-button--block {
+  display: flex;
+  width: 100%;
+}
+.t-button--disabled {
+  cursor: not-allowed;
+}
+.t-button__loading--wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.t-button.t-button--hover::after {
+  z-index: -1;
+}

miniprogram/miniprogram_npm/tdesign-miniprogram/button/index.d.ts

@@ -0,0 +1,3 @@
+export * from './props';
+export * from './type';
+export * from './button';

miniprogram/miniprogram_npm/tdesign-miniprogram/button/index.js

@@ -0,0 +1,3 @@
+export * from './props';
+export * from './type';
+export * from './button';

miniprogram/miniprogram_npm/tdesign-miniprogram/button/props.d.ts

@@ -0,0 +1,3 @@
+import { TdButtonProps } from './type';
+declare const props: TdButtonProps;
+export default props;

miniprogram/miniprogram_npm/tdesign-miniprogram/button/props.js

@@ -0,0 +1,100 @@
+const props = {
+    block: {
+        type: Boolean,
+        value: false,
+    },
+    content: {
+        type: String,
+    },
+    customDataset: {
+        type: null,
+    },
+    disabled: {
+        type: Boolean,
+        value: false,
+    },
+    externalClasses: {
+        type: Array,
+    },
+    ghost: {
+        type: Boolean,
+        value: false,
+    },
+    icon: {
+        type: null,
+    },
+    loading: {
+        type: Boolean,
+        value: false,
+    },
+    loadingProps: {
+        type: Object,
+    },
+    shape: {
+        type: String,
+        value: 'rectangle',
+    },
+    size: {
+        type: String,
+        value: 'medium',
+    },
+    theme: {
+        type: String,
+        value: 'default',
+    },
+    type: {
+        type: String,
+    },
+    variant: {
+        type: String,
+        value: 'base',
+    },
+    openType: {
+        type: String,
+    },
+    hoverClass: {
+        type: String,
+        value: '',
+    },
+    hoverStopPropagation: {
+        type: Boolean,
+        value: false,
+    },
+    hoverStartTime: {
+        type: Number,
+        value: 20,
+    },
+    hoverStayTime: {
+        type: Number,
+        value: 70,
+    },
+    lang: {
+        type: String,
+        value: 'en',
+    },
+    sessionFrom: {
+        type: String,
+        value: '',
+    },
+    sendMessageTitle: {
+        type: String,
+        value: '',
+    },
+    sendMessagePath: {
+        type: String,
+        value: '',
+    },
+    sendMessageImg: {
+        type: String,
+        value: '',
+    },
+    appParameter: {
+        type: String,
+        value: '',
+    },
+    showMessageCard: {
+        type: Boolean,
+        value: false,
+    },
+};
+export default props;

miniprogram/miniprogram_npm/tdesign-miniprogram/button/type.d.ts

@@ -0,0 +1,108 @@
+import { LoadingProps } from '../loading/index';
+import { SizeEnum } from '../common/common';
+export interface TdButtonProps {
+    block?: {
+        type: BooleanConstructor;
+        value?: boolean;
+    };
+    content?: {
+        type: StringConstructor;
+        value?: string;
+    };
+    customDataset?: {
+        type: ObjectConstructor;
+        value?: any;
+    };
+    disabled?: {
+        type: BooleanConstructor;
+        value?: boolean;
+    };
+    externalClasses?: {
+        type: ArrayConstructor;
+        value?: ['t-class', 't-class-icon', 't-class-loading'];
+    };
+    ghost?: {
+        type: BooleanConstructor;
+        value?: boolean;
+    };
+    icon?: {
+        type: null;
+        value?: string | object;
+    };
+    loading?: {
+        type: BooleanConstructor;
+        value?: boolean;
+    };
+    loadingProps?: {
+        type: ObjectConstructor;
+        value?: LoadingProps;
+    };
+    shape?: {
+        type: StringConstructor;
+        value?: 'rectangle' | 'square' | 'round' | 'circle';
+    };
+    size?: {
+        type: StringConstructor;
+        value?: SizeEnum;
+    };
+    theme?: {
+        type: StringConstructor;
+        value?: 'default' | 'primary' | 'danger';
+    };
+    type?: {
+        type: StringConstructor;
+        value?: 'submit' | 'reset';
+    };
+    variant?: {
+        type: StringConstructor;
+        value?: 'base' | 'outline' | 'text';
+    };
+    openType?: {
+        type: StringConstructor;
+        value?: 'contact' | 'share' | 'getPhoneNumber' | 'getUserInfo' | 'launchApp' | 'openSetting' | 'feedback' | 'chooseAvatar';
+    };
+    hoverClass?: {
+        type: StringConstructor;
+        value?: string;
+    };
+    hoverStopPropagation?: {
+        type: BooleanConstructor;
+        value?: boolean;
+    };
+    hoverStartTime?: {
+        type: NumberConstructor;
+        value?: number;
+    };
+    hoverStayTime?: {
+        type: NumberConstructor;
+        value?: number;
+    };
+    lang?: {
+        type: StringConstructor;
+        value?: 'en' | 'zh_CN' | 'zh_TW';
+    };
+    sessionFrom?: {
+        type: StringConstructor;
+        value?: string;
+    };
+    sendMessageTitle?: {
+        type: StringConstructor;
+        value?: string;
+    };
+    sendMessagePath?: {
+        type: StringConstructor;
+        value?: string;
+    };
+    sendMessageImg?: {
+        type: StringConstructor;
+        value?: string;
+    };
+    appParameter?: {
+        type: StringConstructor;
+        value?: string;
+    };
+    showMessageCard?: {
+        type: BooleanConstructor;
+        value?: boolean;
+    };
+}

miniprogram/miniprogram_npm/tdesign-miniprogram/button/type.js

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