@tuya-miniapp/smart-ui 2.13.2-beta-0 → 2.13.2-beta-1

package/dist/button/README.md

@@ -0,0 +1,205 @@
+---
+category: 通用
+---
+
+# Button 按钮
+
+### 介绍
+
+按钮用于触发一个操作，如提交表单。
+
+### 引入
+
+在`app.json`或`index.json`中引入组件，详细介绍见[快速上手](/material/smartui?comId=help-getting-started&appType=miniapp)。
+
+```json
+"usingComponents": {
+  "smart-button": "@tuya-miniapp/smart-ui/lib/button/index"
+}
+```
+
+## 代码演示
+
+### 按钮类型
+
+支持`default`、`primary`、`info`、`warning`、`danger`五种类型，默认为`default`。
+
+```html
+<smart-button type="default">默认按钮</smart-button>
+<smart-button type="primary">主要按钮</smart-button>
+<smart-button type="info">信息按钮</smart-button>
+<smart-button type="warning">警告按钮</smart-button>
+<smart-button type="danger">危险按钮</smart-button>
+```
+
+### 朴素按钮
+
+通过`plain`属性将按钮设置为朴素按钮，朴素按钮的文字为按钮颜色；默认背景为白色，字体为黑色。
+
+
+```html
+<smart-button plain>朴素按钮</smart-button>
+<smart-button plain type="primary">朴素按钮</smart-button>
+<smart-button plain type="info">朴素按钮</smart-button>
+```
+
+### 细边框
+
+设置`hairline`属性可以开启 0.5px 边框，基于伪类实现。
+
+```html
+<smart-button plain hairline type="primary">细边框按钮</smart-button>
+<smart-button plain hairline type="info">细边框按钮</smart-button>
+```
+
+### 禁用状态
+
+通过`disabled`属性来禁用按钮，此时按钮的`bind:click`事件不会触发。
+
+```html
+<smart-button disabled type="primary">禁用状态</smart-button>
+<smart-button disabled type="info">禁用状态</smart-button>
+```
+
+### 加载状态
+
+```html
+<smart-button loading type="primary" />
+<smart-button loading type="primary" loading-type="spinner" />
+<smart-button loading type="primary" loading-text="加载中..." />
+```
+
+### 按钮形状
+
+```html
+<smart-button square type="primary">方形按钮</smart-button>
+<smart-button round type="info">圆形按钮</smart-button>
+```
+
+### 图标按钮
+
+通过`icon`属性设置按钮图标，支持 Icon 组件里的所有图标，也可以传入图标 URL。
+
+```html
+<smart-button icon="{{ iconAdd }}" type="primary" />
+<smart-button icon="{{ iconAdd }}" type="primary">按钮</smart-button>
+<smart-button icon="https://static1.tuyacn.com/static/tuya-miniapp-doc/_next/static/images/logo-small.png" type="info">
+  按钮
+</smart-button>
+```
+
+### 按钮尺寸
+
+支持`large`、`normal`、`small`、`mini`四种尺寸，默认为`normal`。
+
+```html
+<smart-button type="primary" size="large">大号按钮</smart-button>
+<smart-button type="primary" size="normal">普通按钮</smart-button>
+<smart-button type="primary" size="small">小型按钮</smart-button>
+<smart-button type="primary" size="mini">迷你按钮</smart-button>
+```
+
+### 块级元素
+
+通过`block`属性可以将按钮的元素类型设置为块级元素。
+
+```html
+<smart-button type="primary" block>块级元素</smart-button>
+```
+
+### 自定义颜色
+
+通过`color`属性可以自定义按钮的颜色。
+
+```html
+<smart-button color="#7232dd">单色按钮</smart-button>
+<smart-button color="#7232dd" plain>单色按钮</smart-button>
+<smart-button color="linear-gradient(to right, #4bb0ff, #6149f6)">
+  渐变色按钮
+</smart-button>
+```
+
+## API
+
+### Props
+
+| 参数         | 说明                                                     | 类型      | 默认值       |
+| ------------ | -------------------------------------------------------- | --------- | ------------ |
+| block        | 是否为块级元素                                           | _boolean_ | `false`      |
+| button-id    | 标识符，作为原生 button 组件的 id 值                     | _string_  | -            |
+| class-prefix | 图标类名前缀，同 Icon 组件的 [class-prefix 属性](/material/smartui?comId=icon&appType=miniapp) | _string_  | `smart-icon` |
+| color        | 按钮颜色，支持传入`linear-gradient`渐变色                | _string_  | -            |
+| custom-style | 自定义样式                                               | _string_  | -            |
+| disabled     | 是否禁用按钮                                             | _boolean_ | `false`      |
+| hairline     | 是否使用 0.5px 边框                                      | _boolean_ | `false`      |
+| icon         | 左侧图标或图片链接，可选值见 [Icon 组件](/material/smartui?comId=icon&appType=miniapp)         | _string_  | -            |
+| id           | 标识符                                                   | _string_  | -            |
+| loading      | 是否显示为加载状态                                       | _boolean_ | `false`      |
+| loading-size | 加载图标大小                                             | _string_  | `20px`       |
+| loading-text | 加载状态提示文字                                         | _string_  | -            |
+| text-style   | 按钮文字样式                                         | _string_  | -            |
+| loading-type | 加载状态图标类型，可选值为 `spinner`                     | _string_  | `circular`   |
+| plain        | 是否为朴素按钮                                           | _boolean_ | `false`      |
+| right-icon   | 右侧图标或图片链接，可选值见 [Icon 组件](/material/smartui?comId=icon&appType=miniapp)         | _string_  | -            |
+| round        | 是否为圆形按钮                                           | _boolean_ | `false`      |
+| size         | 按钮尺寸，可选值为 `normal` `large` `small` `mini`       | _string_  | `normal`     |
+| square       | 是否为方形按钮                                           | _boolean_ | `false`      |
+| type         | 按钮类型，可选值为 `primary` `info` `warning` `danger`   | _string_  | `default`    |
+
+### Events
+
+| 事件名     | 说明                                     | 参数 |
+| ---------- | ---------------------------------------- | ---- |
+| bind:click | 点击按钮，且按钮状态不为加载或禁用时触发 | -    |
+| bind:error | 当使用开放能力时，发生错误的回调 | - |
+
+> Button 提供的是 click 事件而不是原生 tap 事件，按钮禁用时，click 事件不会触发，tap 事件依然会触发。
+
+### 外部样式类
+
+| 类名          | 说明           |
+| ------------- | -------------- |
+| custom-class  | 根节点样式类   |
+| loading-class | 加载图标样式类 |
+| hover-class | 按钮按下时的样式 |
+
+
+### 样式变量
+
+组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 [ConfigProvider 组件](/material/smartui?comId=config-provider&appType=miniapp)。
+| 名称                                          | 默认值                                         | 描述                               |
+| --------------------------------------------- | ---------------------------------------------- | ---------------------------------- |
+| --button-mini-height                          | _22px_                                         | 迷你按钮高度                       |
+| --button-mini-min-width                       | _50px_                                         | 迷你按钮最小宽度                   |
+| --button-mini-font-size                       | _10px_                                         | 迷你按钮字体大小                   |
+| --button-small-height                         | _30px_                                         | 小按钮高度                         |
+| --button-small-font-size                      | _12px_                                         | 小按钮字体大小                     |
+| --button-small-min-width                      | _60px_                                         | 小按钮最小宽度                     |
+| --button-normal-font-size                     | _14px_                                         | 普通按钮字体大小                   |
+| --button-large-height                         | _48px_                                         | 大按钮高度                         |
+| --button-default-color                        | _var(--app-B1-N1, rgba(0, 0, 0, 1))_           | 默认按钮字体颜色                   |
+| --button-default-height                       | _48px_                                         | 默认按钮高度                       |
+| --button-default-font-size                    | _16px_                                         | 默认按钮字体大小                   |
+| --button-default-background-color             | _var(--app-B3, #ffffff)_                       | 默认按钮背景颜色                   |
+| --button-default-border-color                 | _var(--app-B6-N7, rgba(0, 0, 0, 0.1))_         | 默认按钮边框颜色                   |
+| --button-primary-color                        | _#fff_                                         | 主按钮字体颜色                     |
+| --button-primary-background-color             | _var(--app-M3, #2dda86)_                       | 主按钮背景颜色                     |
+| --button-primary-border-color                 | _var(--app-M3, #2dda86)_                       | 主按钮边框颜色                     |
+| --button-info-color                           | _#fff_                                         | 信息按钮字体颜色                   |
+| --button-info-background-color                | _var(--app-M4, #1989fa)_                       | 信息按钮背景颜色                   |
+| --button-info-border-color                    | _var(--app-M4, #1989fa)_                       | 信息按钮边框颜色                   |
+| --button-danger-color                         | _#fff_                                         | 危险按钮字体颜色                   |
+| --button-danger-background-color              | _var(--app-M2, #f04c4c)_                       | 危险按钮背景颜色                   |
+| --button-danger-border-color                  | _var(--app-M2, #f04c4c)_                       | 危险按钮边框颜色                   |
+| --button-warning-color                        | _#fff_                                         | 警告按钮字体颜色                   |
+| --button-warning-background-color             | _var(--app-M5, #ffa000)_                       | 警告按钮背景颜色                   |
+| --button-warning-border-color                 | _var(--app-M5, #ffa000)_                       | 警告按钮边框颜色                   |
+| --button-line-height                          | _20px_                                         | 按钮行高                           |
+| --button-border-width                         | _1px_                                          | 按钮边框宽度                       |
+| --button-border-radius                        | _10px_                                         | 按钮边框圆角半径                   |
+| --button-round-border-radius                  | _999px_                                        | 圆形按钮边框圆角半径               |
+| --button-plain-color `v2.13.2`        | _rgba(0, 0, 0, 0.9)_                           | 纯按钮文字颜色                     |
+| --button-plain-background-color               | _#fff_                                         | 纯按钮背景颜色                     |
+| --button-disabled-opacity                     | _0.3_                                          | 禁用按钮不透明度                   |
+| --button-font-weight                          | _normal_                                       | 按钮字体粗细                       |
+| --button-primary-font-weight                  | _600_                                          | 主按钮字体粗细                     |

package/dist/button/index.css

@@ -1 +1 @@
-@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-bottom-sheet-dragger-node-background:rgba(0,0,0,.3);--smart-ui-dialog-background:var(--app-B4,#fff);--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent);--smart-ui-battery-body-base-background:rgba(0,0,0,.25);--smart-ui-battery-text-color:rgba(0,0,0,.6);--smart-ui-battery-slash-border-color:#fff;--smart-ui-toast-background:#5c5c5c;--smart-ui-toast-border:1px solid hsla(0,0%,100%,.05);--smart-ui-toast-box-shadow:0 4px 12px rgba(0,0,0,.1),0 16px 32px rgba(0,0,0,.12);--smart-ui-overlay-blur-background:rgba(40,44,53,.22)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-bottom-sheet-dragger-node-background:hsla(0,0%,100%,.3);--smart-ui-dialog-background:linear-gradient(0deg,var(--app-B4-N6),var(--app-B4-N6)),var(--app-B1);--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0));--smart-ui-battery-body-base-background:hsla(0,0%,100%,.4);--smart-ui-battery-text-color:#fff;--smart-ui-battery-slash-border-color:#000;--smart-ui-toast-background:#3c3c3c;--smart-ui-toast-border:1px solid hsla(0,0%,100%,.05);--smart-ui-toast-box-shadow:0 8px 24px 0 rgba(0,0,0,.15);--smart-ui-overlay-blur-background:rgba(0,0,0,.6)}.smart-manrope{font-family:Manrope,sans-serif}:root{--smart-a11y-action-sheet-item-text-color:#000}:root[theme=dark]{--smart-a11y-action-sheet-item-text-color:#fff}.smart-button{-webkit-text-size-adjust:100%;align-items:center;-webkit-appearance:none;border-radius:var(--button-border-radius,10px);box-sizing:border-box;display:inline-flex;font-size:var(--button-default-font-size,16px);font-weight:400;height:var(--button-default-height,48px);justify-content:center;line-height:var(--button-line-height,20px);padding:0;position:relative;text-align:center;transition:opacity .2s;vertical-align:middle}.smart-button:before{background-color:#000;border:inherit;border-color:#000;border-radius:inherit;content:" ";height:100%;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);width:100%}.smart-button:after{border-width:0}.smart-button--active:before{opacity:.15}.smart-button--unclickable:after{display:none}.smart-button--default{background:var(--button-default-background-color,var(--app-B3,#fff));border:var(--button-border-width,1px) solid var(--button-default-border-color,var(--app-B6-N7,rgba(0,0,0,.1)));color:var(--button-default-color,var(--app-B1-N1,rgba(0,0,0,.9)))}.smart-button--default .smart-button__icon>view>view,.smart-button--default .smart-button__right-icon>view>view{background:var(--button-default-color,var(--app-B1-N1,rgba(0,0,0,.9)))}.smart-button--primary{background:var(--button-primary-background-color,var(--app-M3,#2dda86));border:var(--button-border-width,1px) solid var(--button-primary-border-color,var(--app-M3,#2dda86));color:var(--button-primary-color,#fff);font-weight:600}.smart-button--primary .smart-button__icon>view>view,.smart-button--primary .smart-button__right-icon>view>view{background:var(--button-primary-color,#fff)}.smart-button--info{background:var(--button-info-background-color,var(--app-M4,#1989fa));border:var(--button-border-width,1px) solid var(--button-info-border-color,var(--app-M4,#1989fa));color:var(--button-info-color,#fff)}.smart-button--info .smart-button__icon>view>view,.smart-button--info .smart-button__right-icon>view>view{background:var(--button-info-color,#fff)}.smart-button--danger{background:var(--button-danger-background-color,var(--app-M2,#f04c4c));border:var(--button-border-width,1px) solid var(--button-danger-border-color,var(--app-M2,#f04c4c));color:var(--button-danger-color,#fff)}.smart-button--danger .smart-button__icon>view>view,.smart-button--danger .smart-button__right-icon>view>view{background:var(--button-danger-color,#fff)}.smart-button--warning{background:var(--button-warning-background-color,var(--app-M5,#ffa000));border:var(--button-border-width,1px) solid var(--button-warning-border-color,var(--app-M5,#ffa000));color:var(--button-warning-color,#fff)}.smart-button--warning .smart-button__icon>view>view,.smart-button--warning .smart-button__right-icon>view>view{background:var(--button-warning-color,#fff)}.smart-button--plain{background:var(--button-plain-background-color,#fff)}.smart-button--plain.smart-button--primary{color:var(--button-primary-background-color,var(--app-M3,#2dda86))}.smart-button--plain.smart-button--primary .smart-button__icon>view>view,.smart-button--plain.smart-button--primary .smart-button__right-icon>view>view{background:var(--button-primary-background-color,var(--app-M3,#2dda86))}.smart-button--plain.smart-button--info{color:var(--button-info-background-color,var(--app-M4,#1989fa))}.smart-button--plain.smart-button--info .smart-button__icon>view>view,.smart-button--plain.smart-button--info .smart-button__right-icon>view>view{background:var(--button-info-background-color,var(--app-M4,#1989fa))}.smart-button--plain.smart-button--danger{color:var(--button-danger-background-color,var(--app-M2,#f04c4c))}.smart-button--plain.smart-button--danger .smart-button__icon>view>view,.smart-button--plain.smart-button--danger .smart-button__right-icon>view>view{background:var(--button-danger-background-color,var(--app-M2,#f04c4c))}.smart-button--plain.smart-button--warning{color:var(--button-warning-background-color,var(--app-M5,#ffa000))}.smart-button--plain.smart-button--warning .smart-button__icon>view>view,.smart-button--plain.smart-button--warning .smart-button__right-icon>view>view{background:var(--button-warning-background-color,var(--app-M5,#ffa000))}.smart-button--large{height:var(--button-large-height,48px);width:100%}.smart-button--normal{font-size:var(--button-normal-font-size,14px);padding:0 15px}.smart-button--small{font-size:var(--button-small-font-size,12px);height:var(--button-small-height,30px);min-width:var(--button-small-min-width,60px);padding:0 var(--padding-xs,8px)}.smart-button--mini{display:inline-block;font-size:var(--button-mini-font-size,10px);height:var(--button-mini-height,22px);min-width:var(--button-mini-min-width,50px)}.smart-button--mini+.smart-button--mini{margin-left:5px}.smart-button--block{display:flex;width:100%}.smart-button--round{border-radius:var(--button-round-border-radius,999px)}.smart-button--square{border-radius:0}.smart-button--disabled{opacity:var(--button-disabled-opacity,.3)}.smart-button__text{display:inline}.smart-button__icon+.smart-button__text:not(:empty),.smart-button__loading-text,.smart-button__text:not(:empty)+.smart-button__right-icon{margin-left:4px}.smart-button__icon,.smart-button__right-icon{line-height:inherit!important;min-width:1em;vertical-align:top}.smart-button--hairline{border-width:0;padding-top:1px}.smart-button--hairline:after{border-color:inherit;border-radius:calc(var(--button-border-radius, 10px)*2);border-width:1px}.smart-button--hairline.smart-button--round:after{border-radius:var(--button-round-border-radius,999px)}.smart-button--hairline.smart-button--square:after{border-radius:0}:root[data-a11y=true] .smart-button{font-size:var(--button-default-font-size,20px);font-weight:var(--button-font-weight,600);height:var(--button-default-height,59px);line-height:var(--button-line-height,30px)}:root[data-a11y=true] .smart-button--large{height:var(--button-large-height,59px)}
+@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-bottom-sheet-dragger-node-background:rgba(0,0,0,.3);--smart-ui-dialog-background:var(--app-B4,#fff);--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent);--smart-ui-battery-body-base-background:rgba(0,0,0,.25);--smart-ui-battery-text-color:rgba(0,0,0,.6);--smart-ui-battery-slash-border-color:#fff;--smart-ui-toast-background:#5c5c5c;--smart-ui-toast-border:1px solid hsla(0,0%,100%,.05);--smart-ui-toast-box-shadow:0 4px 12px rgba(0,0,0,.1),0 16px 32px rgba(0,0,0,.12);--smart-ui-overlay-blur-background:rgba(40,44,53,.22)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-bottom-sheet-dragger-node-background:hsla(0,0%,100%,.3);--smart-ui-dialog-background:linear-gradient(0deg,var(--app-B4-N6),var(--app-B4-N6)),var(--app-B1);--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0));--smart-ui-battery-body-base-background:hsla(0,0%,100%,.4);--smart-ui-battery-text-color:#fff;--smart-ui-battery-slash-border-color:#000;--smart-ui-toast-background:#3c3c3c;--smart-ui-toast-border:1px solid hsla(0,0%,100%,.05);--smart-ui-toast-box-shadow:0 8px 24px 0 rgba(0,0,0,.15);--smart-ui-overlay-blur-background:rgba(0,0,0,.6)}.smart-manrope{font-family:Manrope,sans-serif}:root{--smart-a11y-action-sheet-item-text-color:#000}:root[theme=dark]{--smart-a11y-action-sheet-item-text-color:#fff}.smart-button{-webkit-text-size-adjust:100%;align-items:center;-webkit-appearance:none;border-radius:var(--button-border-radius,10px);box-sizing:border-box;display:inline-flex;font-size:var(--button-default-font-size,16px);font-weight:400;height:var(--button-default-height,48px);justify-content:center;line-height:var(--button-line-height,20px);padding:0;position:relative;text-align:center;transition:opacity .2s;vertical-align:middle}.smart-button:before{background-color:#000;border:inherit;border-color:#000;border-radius:inherit;content:" ";height:100%;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);width:100%}.smart-button:after{border-width:0}.smart-button--active:before{opacity:.15}.smart-button--unclickable:after{display:none}.smart-button--default{background:var(--button-default-background-color,var(--app-B3,#fff));border:var(--button-border-width,1px) solid var(--button-default-border-color,var(--app-B6-N7,rgba(0,0,0,.1)));color:var(--button-default-color,var(--app-B1-N1,rgba(0,0,0,.9)))}.smart-button--default .smart-button__icon>view>view,.smart-button--default .smart-button__right-icon>view>view{background:var(--button-default-color,var(--app-B1-N1,rgba(0,0,0,.9)))}.smart-button--primary{background:var(--button-primary-background-color,var(--app-M3,#2dda86));border:var(--button-border-width,1px) solid var(--button-primary-border-color,var(--app-M3,#2dda86));color:var(--button-primary-color,#fff);font-weight:600}.smart-button--primary .smart-button__icon>view>view,.smart-button--primary .smart-button__right-icon>view>view{background:var(--button-primary-color,#fff)}.smart-button--info{background:var(--button-info-background-color,var(--app-M4,#1989fa));border:var(--button-border-width,1px) solid var(--button-info-border-color,var(--app-M4,#1989fa));color:var(--button-info-color,#fff)}.smart-button--info .smart-button__icon>view>view,.smart-button--info .smart-button__right-icon>view>view{background:var(--button-info-color,#fff)}.smart-button--danger{background:var(--button-danger-background-color,var(--app-M2,#f04c4c));border:var(--button-border-width,1px) solid var(--button-danger-border-color,var(--app-M2,#f04c4c));color:var(--button-danger-color,#fff)}.smart-button--danger .smart-button__icon>view>view,.smart-button--danger .smart-button__right-icon>view>view{background:var(--button-danger-color,#fff)}.smart-button--warning{background:var(--button-warning-background-color,var(--app-M5,#ffa000));border:var(--button-border-width,1px) solid var(--button-warning-border-color,var(--app-M5,#ffa000));color:var(--button-warning-color,#fff)}.smart-button--warning .smart-button__icon>view>view,.smart-button--warning .smart-button__right-icon>view>view{background:var(--button-warning-color,#fff)}.smart-button--plain{background:var(--button-plain-background-color,#fff);color:var(--button-plain-color,rgba(0,0,0,.9))}.smart-button--plain.smart-button--primary{color:var(--button-primary-background-color,var(--app-M3,#2dda86))}.smart-button--plain.smart-button--primary .smart-button__icon>view>view,.smart-button--plain.smart-button--primary .smart-button__right-icon>view>view{background:var(--button-primary-background-color,var(--app-M3,#2dda86))}.smart-button--plain.smart-button--info{color:var(--button-info-background-color,var(--app-M4,#1989fa))}.smart-button--plain.smart-button--info .smart-button__icon>view>view,.smart-button--plain.smart-button--info .smart-button__right-icon>view>view{background:var(--button-info-background-color,var(--app-M4,#1989fa))}.smart-button--plain.smart-button--danger{color:var(--button-danger-background-color,var(--app-M2,#f04c4c))}.smart-button--plain.smart-button--danger .smart-button__icon>view>view,.smart-button--plain.smart-button--danger .smart-button__right-icon>view>view{background:var(--button-danger-background-color,var(--app-M2,#f04c4c))}.smart-button--plain.smart-button--warning{color:var(--button-warning-background-color,var(--app-M5,#ffa000))}.smart-button--plain.smart-button--warning .smart-button__icon>view>view,.smart-button--plain.smart-button--warning .smart-button__right-icon>view>view{background:var(--button-warning-background-color,var(--app-M5,#ffa000))}.smart-button--large{height:var(--button-large-height,48px);width:100%}.smart-button--normal{font-size:var(--button-normal-font-size,14px);padding:0 15px}.smart-button--small{font-size:var(--button-small-font-size,12px);height:var(--button-small-height,30px);min-width:var(--button-small-min-width,60px);padding:0 var(--padding-xs,8px)}.smart-button--mini{display:inline-block;font-size:var(--button-mini-font-size,10px);height:var(--button-mini-height,22px);min-width:var(--button-mini-min-width,50px)}.smart-button--mini+.smart-button--mini{margin-left:5px}.smart-button--block{display:flex;width:100%}.smart-button--round{border-radius:var(--button-round-border-radius,999px)}.smart-button--square{border-radius:0}.smart-button--disabled{opacity:var(--button-disabled-opacity,.3)}.smart-button__text{display:inline}.smart-button__icon+.smart-button__text:not(:empty),.smart-button__loading-text,.smart-button__text:not(:empty)+.smart-button__right-icon{margin-left:4px}.smart-button__icon,.smart-button__right-icon{line-height:inherit!important;min-width:1em;vertical-align:top}.smart-button--hairline{border-width:0;padding-top:1px}.smart-button--hairline:after{border-color:inherit;border-radius:calc(var(--button-border-radius, 10px)*2);border-width:1px}.smart-button--hairline.smart-button--round:after{border-radius:var(--button-round-border-radius,999px)}.smart-button--hairline.smart-button--square:after{border-radius:0}:root[data-a11y=true] .smart-button{font-size:var(--button-default-font-size,20px);font-weight:var(--button-font-weight,600);height:var(--button-default-height,59px);line-height:var(--button-line-height,30px)}:root[data-a11y=true] .smart-button--large{height:var(--button-large-height,59px)}

package/dist/button/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-bottom-sheet-dragger-node-background:rgba(0,0,0,.3);--smart-ui-dialog-background:var(--app-B4,#fff);--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent);--smart-ui-battery-body-base-background:rgba(0,0,0,.25);--smart-ui-battery-text-color:rgba(0,0,0,.6);--smart-ui-battery-slash-border-color:#fff;--smart-ui-toast-background:#5c5c5c;--smart-ui-toast-border:1px solid hsla(0,0%,100%,.05);--smart-ui-toast-box-shadow:0 4px 12px rgba(0,0,0,.1),0 16px 32px rgba(0,0,0,.12);--smart-ui-overlay-blur-background:rgba(40,44,53,.22)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-bottom-sheet-dragger-node-background:hsla(0,0%,100%,.3);--smart-ui-dialog-background:linear-gradient(0deg,var(--app-B4-N6),var(--app-B4-N6)),var(--app-B1);--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0));--smart-ui-battery-body-base-background:hsla(0,0%,100%,.4);--smart-ui-battery-text-color:#fff;--smart-ui-battery-slash-border-color:#000;--smart-ui-toast-background:#3c3c3c;--smart-ui-toast-border:1px solid hsla(0,0%,100%,.05);--smart-ui-toast-box-shadow:0 8px 24px 0 rgba(0,0,0,.15);--smart-ui-overlay-blur-background:rgba(0,0,0,.6)}.smart-manrope{font-family:Manrope,sans-serif}:root{--smart-a11y-action-sheet-item-text-color:#000}:root[theme=dark]{--smart-a11y-action-sheet-item-text-color:#fff}.smart-button{-webkit-text-size-adjust:100%;align-items:center;-webkit-appearance:none;border-radius:var(--button-border-radius,10px);box-sizing:border-box;display:inline-flex;font-size:var(--button-default-font-size,16px);font-weight:400;height:var(--button-default-height,48px);justify-content:center;line-height:var(--button-line-height,20px);padding:0;position:relative;text-align:center;transition:opacity .2s;vertical-align:middle}.smart-button:before{background-color:#000;border:inherit;border-color:#000;border-radius:inherit;content:" ";height:100%;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);width:100%}.smart-button:after{border-width:0}.smart-button--active:before{opacity:.15}.smart-button--unclickable:after{display:none}.smart-button--default{background:var(--button-default-background-color,var(--app-B3,#fff));border:var(--button-border-width,1px) solid var(--button-default-border-color,var(--app-B6-N7,rgba(0,0,0,.1)));color:var(--button-default-color,var(--app-B1-N1,rgba(0,0,0,.9)))}.smart-button--default .smart-button__icon>view>view,.smart-button--default .smart-button__right-icon>view>view{background:var(--button-default-color,var(--app-B1-N1,rgba(0,0,0,.9)))}.smart-button--primary{background:var(--button-primary-background-color,var(--app-M3,#2dda86));border:var(--button-border-width,1px) solid var(--button-primary-border-color,var(--app-M3,#2dda86));color:var(--button-primary-color,#fff);font-weight:600}.smart-button--primary .smart-button__icon>view>view,.smart-button--primary .smart-button__right-icon>view>view{background:var(--button-primary-color,#fff)}.smart-button--info{background:var(--button-info-background-color,var(--app-M4,#1989fa));border:var(--button-border-width,1px) solid var(--button-info-border-color,var(--app-M4,#1989fa));color:var(--button-info-color,#fff)}.smart-button--info .smart-button__icon>view>view,.smart-button--info .smart-button__right-icon>view>view{background:var(--button-info-color,#fff)}.smart-button--danger{background:var(--button-danger-background-color,var(--app-M2,#f04c4c));border:var(--button-border-width,1px) solid var(--button-danger-border-color,var(--app-M2,#f04c4c));color:var(--button-danger-color,#fff)}.smart-button--danger .smart-button__icon>view>view,.smart-button--danger .smart-button__right-icon>view>view{background:var(--button-danger-color,#fff)}.smart-button--warning{background:var(--button-warning-background-color,var(--app-M5,#ffa000));border:var(--button-border-width,1px) solid var(--button-warning-border-color,var(--app-M5,#ffa000));color:var(--button-warning-color,#fff)}.smart-button--warning .smart-button__icon>view>view,.smart-button--warning .smart-button__right-icon>view>view{background:var(--button-warning-color,#fff)}.smart-button--plain{background:var(--button-plain-background-color,#fff)}.smart-button--plain.smart-button--primary{color:var(--button-primary-background-color,var(--app-M3,#2dda86))}.smart-button--plain.smart-button--primary .smart-button__icon>view>view,.smart-button--plain.smart-button--primary .smart-button__right-icon>view>view{background:var(--button-primary-background-color,var(--app-M3,#2dda86))}.smart-button--plain.smart-button--info{color:var(--button-info-background-color,var(--app-M4,#1989fa))}.smart-button--plain.smart-button--info .smart-button__icon>view>view,.smart-button--plain.smart-button--info .smart-button__right-icon>view>view{background:var(--button-info-background-color,var(--app-M4,#1989fa))}.smart-button--plain.smart-button--danger{color:var(--button-danger-background-color,var(--app-M2,#f04c4c))}.smart-button--plain.smart-button--danger .smart-button__icon>view>view,.smart-button--plain.smart-button--danger .smart-button__right-icon>view>view{background:var(--button-danger-background-color,var(--app-M2,#f04c4c))}.smart-button--plain.smart-button--warning{color:var(--button-warning-background-color,var(--app-M5,#ffa000))}.smart-button--plain.smart-button--warning .smart-button__icon>view>view,.smart-button--plain.smart-button--warning .smart-button__right-icon>view>view{background:var(--button-warning-background-color,var(--app-M5,#ffa000))}.smart-button--large{height:var(--button-large-height,48px);width:100%}.smart-button--normal{font-size:var(--button-normal-font-size,14px);padding:0 15px}.smart-button--small{font-size:var(--button-small-font-size,12px);height:var(--button-small-height,30px);min-width:var(--button-small-min-width,60px);padding:0 var(--padding-xs,8px)}.smart-button--mini{display:inline-block;font-size:var(--button-mini-font-size,10px);height:var(--button-mini-height,22px);min-width:var(--button-mini-min-width,50px)}.smart-button--mini+.smart-button--mini{margin-left:5px}.smart-button--block{display:flex;width:100%}.smart-button--round{border-radius:var(--button-round-border-radius,999px)}.smart-button--square{border-radius:0}.smart-button--disabled{opacity:var(--button-disabled-opacity,.3)}.smart-button__text{display:inline}.smart-button__icon+.smart-button__text:not(:empty),.smart-button__loading-text,.smart-button__text:not(:empty)+.smart-button__right-icon{margin-left:4px}.smart-button__icon,.smart-button__right-icon{line-height:inherit!important;min-width:1em;vertical-align:top}.smart-button--hairline{border-width:0;padding-top:1px}.smart-button--hairline:after{border-color:inherit;border-radius:calc(var(--button-border-radius, 10px)*2);border-width:1px}.smart-button--hairline.smart-button--round:after{border-radius:var(--button-round-border-radius,999px)}.smart-button--hairline.smart-button--square:after{border-radius:0}:root[data-a11y=true] .smart-button{font-size:var(--button-default-font-size,20px);font-weight:var(--button-font-weight,600);height:var(--button-default-height,59px);line-height:var(--button-line-height,30px)}:root[data-a11y=true] .smart-button--large{height:var(--button-large-height,59px)}
+@import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-bottom-sheet-dragger-node-background:rgba(0,0,0,.3);--smart-ui-dialog-background:var(--app-B4,#fff);--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent);--smart-ui-battery-body-base-background:rgba(0,0,0,.25);--smart-ui-battery-text-color:rgba(0,0,0,.6);--smart-ui-battery-slash-border-color:#fff;--smart-ui-toast-background:#5c5c5c;--smart-ui-toast-border:1px solid hsla(0,0%,100%,.05);--smart-ui-toast-box-shadow:0 4px 12px rgba(0,0,0,.1),0 16px 32px rgba(0,0,0,.12);--smart-ui-overlay-blur-background:rgba(40,44,53,.22)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-bottom-sheet-dragger-node-background:hsla(0,0%,100%,.3);--smart-ui-dialog-background:linear-gradient(0deg,var(--app-B4-N6),var(--app-B4-N6)),var(--app-B1);--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0));--smart-ui-battery-body-base-background:hsla(0,0%,100%,.4);--smart-ui-battery-text-color:#fff;--smart-ui-battery-slash-border-color:#000;--smart-ui-toast-background:#3c3c3c;--smart-ui-toast-border:1px solid hsla(0,0%,100%,.05);--smart-ui-toast-box-shadow:0 8px 24px 0 rgba(0,0,0,.15);--smart-ui-overlay-blur-background:rgba(0,0,0,.6)}.smart-manrope{font-family:Manrope,sans-serif}:root{--smart-a11y-action-sheet-item-text-color:#000}:root[theme=dark]{--smart-a11y-action-sheet-item-text-color:#fff}.smart-button{-webkit-text-size-adjust:100%;align-items:center;-webkit-appearance:none;border-radius:var(--button-border-radius,10px);box-sizing:border-box;display:inline-flex;font-size:var(--button-default-font-size,16px);font-weight:400;height:var(--button-default-height,48px);justify-content:center;line-height:var(--button-line-height,20px);padding:0;position:relative;text-align:center;transition:opacity .2s;vertical-align:middle}.smart-button:before{background-color:#000;border:inherit;border-color:#000;border-radius:inherit;content:" ";height:100%;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);width:100%}.smart-button:after{border-width:0}.smart-button--active:before{opacity:.15}.smart-button--unclickable:after{display:none}.smart-button--default{background:var(--button-default-background-color,var(--app-B3,#fff));border:var(--button-border-width,1px) solid var(--button-default-border-color,var(--app-B6-N7,rgba(0,0,0,.1)));color:var(--button-default-color,var(--app-B1-N1,rgba(0,0,0,.9)))}.smart-button--default .smart-button__icon>view>view,.smart-button--default .smart-button__right-icon>view>view{background:var(--button-default-color,var(--app-B1-N1,rgba(0,0,0,.9)))}.smart-button--primary{background:var(--button-primary-background-color,var(--app-M3,#2dda86));border:var(--button-border-width,1px) solid var(--button-primary-border-color,var(--app-M3,#2dda86));color:var(--button-primary-color,#fff);font-weight:600}.smart-button--primary .smart-button__icon>view>view,.smart-button--primary .smart-button__right-icon>view>view{background:var(--button-primary-color,#fff)}.smart-button--info{background:var(--button-info-background-color,var(--app-M4,#1989fa));border:var(--button-border-width,1px) solid var(--button-info-border-color,var(--app-M4,#1989fa));color:var(--button-info-color,#fff)}.smart-button--info .smart-button__icon>view>view,.smart-button--info .smart-button__right-icon>view>view{background:var(--button-info-color,#fff)}.smart-button--danger{background:var(--button-danger-background-color,var(--app-M2,#f04c4c));border:var(--button-border-width,1px) solid var(--button-danger-border-color,var(--app-M2,#f04c4c));color:var(--button-danger-color,#fff)}.smart-button--danger .smart-button__icon>view>view,.smart-button--danger .smart-button__right-icon>view>view{background:var(--button-danger-color,#fff)}.smart-button--warning{background:var(--button-warning-background-color,var(--app-M5,#ffa000));border:var(--button-border-width,1px) solid var(--button-warning-border-color,var(--app-M5,#ffa000));color:var(--button-warning-color,#fff)}.smart-button--warning .smart-button__icon>view>view,.smart-button--warning .smart-button__right-icon>view>view{background:var(--button-warning-color,#fff)}.smart-button--plain{background:var(--button-plain-background-color,#fff);color:var(--button-plain-color,rgba(0,0,0,.9))}.smart-button--plain.smart-button--primary{color:var(--button-primary-background-color,var(--app-M3,#2dda86))}.smart-button--plain.smart-button--primary .smart-button__icon>view>view,.smart-button--plain.smart-button--primary .smart-button__right-icon>view>view{background:var(--button-primary-background-color,var(--app-M3,#2dda86))}.smart-button--plain.smart-button--info{color:var(--button-info-background-color,var(--app-M4,#1989fa))}.smart-button--plain.smart-button--info .smart-button__icon>view>view,.smart-button--plain.smart-button--info .smart-button__right-icon>view>view{background:var(--button-info-background-color,var(--app-M4,#1989fa))}.smart-button--plain.smart-button--danger{color:var(--button-danger-background-color,var(--app-M2,#f04c4c))}.smart-button--plain.smart-button--danger .smart-button__icon>view>view,.smart-button--plain.smart-button--danger .smart-button__right-icon>view>view{background:var(--button-danger-background-color,var(--app-M2,#f04c4c))}.smart-button--plain.smart-button--warning{color:var(--button-warning-background-color,var(--app-M5,#ffa000))}.smart-button--plain.smart-button--warning .smart-button__icon>view>view,.smart-button--plain.smart-button--warning .smart-button__right-icon>view>view{background:var(--button-warning-background-color,var(--app-M5,#ffa000))}.smart-button--large{height:var(--button-large-height,48px);width:100%}.smart-button--normal{font-size:var(--button-normal-font-size,14px);padding:0 15px}.smart-button--small{font-size:var(--button-small-font-size,12px);height:var(--button-small-height,30px);min-width:var(--button-small-min-width,60px);padding:0 var(--padding-xs,8px)}.smart-button--mini{display:inline-block;font-size:var(--button-mini-font-size,10px);height:var(--button-mini-height,22px);min-width:var(--button-mini-min-width,50px)}.smart-button--mini+.smart-button--mini{margin-left:5px}.smart-button--block{display:flex;width:100%}.smart-button--round{border-radius:var(--button-round-border-radius,999px)}.smart-button--square{border-radius:0}.smart-button--disabled{opacity:var(--button-disabled-opacity,.3)}.smart-button__text{display:inline}.smart-button__icon+.smart-button__text:not(:empty),.smart-button__loading-text,.smart-button__text:not(:empty)+.smart-button__right-icon{margin-left:4px}.smart-button__icon,.smart-button__right-icon{line-height:inherit!important;min-width:1em;vertical-align:top}.smart-button--hairline{border-width:0;padding-top:1px}.smart-button--hairline:after{border-color:inherit;border-radius:calc(var(--button-border-radius, 10px)*2);border-width:1px}.smart-button--hairline.smart-button--round:after{border-radius:var(--button-round-border-radius,999px)}.smart-button--hairline.smart-button--square:after{border-radius:0}:root[data-a11y=true] .smart-button{font-size:var(--button-default-font-size,20px);font-weight:var(--button-font-weight,600);height:var(--button-default-height,59px);line-height:var(--button-line-height,30px)}:root[data-a11y=true] .smart-button--large{height:var(--button-large-height,59px)}