@tuya-miniapp/smart-ui 2.3.8-beta-5 → 2.3.9-beta-1

package/packages/goods-action/test/demo.spec.ts

@@ -1,11 +0,0 @@
-import path from 'path';
-import simulate from 'miniprogram-simulate';
-
-test('should render demo and match snapshot', () => {
-  const id = simulate.load(path.resolve(__dirname, '../demo/index'), {
-    rootPath: path.resolve(__dirname, '../../'),
-  });
-  const comp = simulate.render(id);
-  comp.attach(document.createElement('parent-wrapper'));
-  expect(comp.toJSON()).toMatchSnapshot();
-});

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

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

package/packages/goods-action-button/index.less

@@ -1,79 +0,0 @@
-@import '../common/style/var.less';
-
-:host {
-  flex: 1;
-}
-
-.smart-goods-action-button {
-  --button-warning-background-color: var(
-    --goods-action-button-warning-color,
-    @goods-action-button-warning-color
-  );
-  --button-danger-background-color: var(
-    --goods-action-button-danger-color,
-    @goods-action-button-danger-color
-  );
-  --button-default-height: var(
-    --goods-action-button-height,
-    @goods-action-button-height
-  );
-  --button-line-height: var(
-    --goods-action-button-line-height,
-    @goods-action-button-line-height
-  );
-  --button-plain-background-color: var(
-    --goods-action-button-plain-color,
-    @goods-action-button-plain-color
-  );
-
-  display: block;
-
-  --button-border-width: 0;
-
-  &--first {
-    margin-left: 5px;
-
-    --button-border-radius: var(
-      --goods-action-button-border-radius,
-      @goods-action-button-border-radius
-    ) 0 0
-      var(
-        --goods-action-button-border-radius,
-        @goods-action-button-border-radius
-      );
-  }
-
-  &--last {
-    margin-right: 5px;
-
-    --button-border-radius: 0 var(
-      --goods-action-button-border-radius,
-      @goods-action-button-border-radius
-    )
-      var(
-        --goods-action-button-border-radius,
-        @goods-action-button-border-radius
-      )
-      0;
-  }
-
-  &--first&--last {
-    --button-border-radius: var(
-      --goods-action-button-border-radius,
-      @goods-action-button-border-radius
-    );
-  }
-
-  &--plain {
-    --button-border-width: @button-border-width;
-  }
-
-  &__inner {
-    width: 100%;
-    font-weight: var(--font-weight-bold, @font-weight-bold) !important;
-  }
-
-  @media (max-width: 321px) {
-    font-size: 13px;
-  }
-}

package/packages/goods-action-button/index.ts

@@ -1,51 +0,0 @@
-import { SmartComponent } from '../common/component';
-import { useParent } from '../common/relation';
-import { button } from '../mixins/button';
-import { link } from '../mixins/link';
-
-SmartComponent({
-  mixins: [link, button],
-
-  relation: useParent('goods-action'),
-
-  props: {
-    text: String,
-    color: String,
-    size: {
-      type: String,
-      value: 'normal',
-    },
-    loading: Boolean,
-    disabled: Boolean,
-    plain: Boolean,
-    type: {
-      type: String,
-      value: 'danger',
-    },
-    customStyle: {
-      type: String,
-      value: '',
-    },
-  },
-
-  methods: {
-    onClick(event: WechatMiniprogram.CustomEvent) {
-      this.$emit('click', event.detail);
-      this.jumpLink();
-    },
-
-    updateStyle() {
-      if (this.parent == null) {
-        return;
-      }
-
-      const { index } = this;
-      const { children = [] } = this.parent;
-
-      this.setData({
-        isFirst: index === 0,
-        isLast: index === children.length - 1,
-      });
-    },
-  },
-});

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

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

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

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

package/packages/goods-action-icon/index.less

@@ -1,26 +0,0 @@
-@import '../common/style/var.less';
-
-.smart-goods-action-icon {
-  display: flex !important;
-  flex-direction: column;
-  justify-content: center !important;
-  line-height: 1 !important;
-  border: none !important;
-  font-size: var(
-    --goods-action-icon-font-size,
-    @goods-action-icon-font-size
-  ) !important;
-  color: var(
-    --goods-action-icon-text-color,
-    @goods-action-icon-text-color
-  ) !important;
-  min-width: var(--goods-action-icon-width, @goods-action-icon-width);
-  height: var(--goods-action-icon-height, @goods-action-icon-height) !important;
-
-  &__icon {
-    display: flex;
-    margin: 0 auto 5px;
-    color: var(--goods-action-icon-color, @goods-action-icon-color);
-    font-size: var(--goods-action-icon-size, @goods-action-icon-size);
-  }
-}

package/packages/goods-action-icon/index.ts

@@ -1,31 +0,0 @@
-import { SmartComponent } from '../common/component';
-import { button } from '../mixins/button';
-import { link } from '../mixins/link';
-
-SmartComponent({
-  classes: ['icon-class', 'text-class', 'info-class'],
-
-  mixins: [link, button],
-
-  props: {
-    text: String,
-    dot: Boolean,
-    info: String,
-    icon: String,
-    size: String,
-    color: String,
-    classPrefix: {
-      type: String,
-      value: 'smart-icon',
-    },
-    disabled: Boolean,
-    loading: Boolean,
-  },
-
-  methods: {
-    onClick(event: WechatMiniprogram.CustomEvent) {
-      this.$emit('click', event.detail);
-      this.jumpLink();
-    },
-  },
-});

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

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

package/packages/grid/README.en.md

@@ -1,198 +0,0 @@
----
-
-category: Layout
-
----
-
-# Grid
-
-### Introduction
-
-The grid can divide a page into equal-width sections horizontally, used for displaying content or page navigation.
-
-### Integration
-
-Introduce the component in `app.json` or `index.json`, see [Quickstart](/material/smartui?comId=help-getting-started&appType=miniapp) for details.
-
-```json
-"usingComponents": {
-  "smart-grid": "@tuya-miniapp/smart-ui/lib/grid/index",
-  "smart-grid-item": "@tuya-miniapp/smart-ui/lib/grid-item/index"
-}
-```
-
-## Code Demonstration
-
-### Basic Usage
-
-Set the icon in the grid with the `icon` attribute and the text with the `text` attribute.
-
-```html
-<smart-grid>
-  <smart-grid-item icon="photo-o" text="Text" />
-  <smart-grid-item icon="photo-o" text="Text" />
-  <smart-grid-item icon="photo-o" text="Text" />
-  <smart-grid-item icon="photo-o" text="Text" />
-</smart-grid>
-```
-
-### Custom Columns
-
-The default displays four grids per row. You can customize the number of columns with the `column-num` attribute.
-
-```html
-<smart-grid column-num="3">
-  <smart-grid-item icon="photo-o" text="Text" ty:for="{{ 6 }}" />
-</smart-grid>
-```
-
-### Custom Content
-
-The grid content can be customized through slots.
-
-```html
-<smart-grid column-num="3" border="{{ false }}">
-  <smart-grid-item use-slot ty:for="{{ 3 }}" ty:for-item="index">
-    <image
-      style="width: 90px; height: 90px;"
-      src="https://static1.tuyacn.com/static/tuya-miniapp-doc/_next/static/images/logo-small.png"
-    />
-  </smart-grid-item>
-</smart-grid>
-```
-
-### Square Grid
-
-Setting the `square` attribute will make the grid's height consistent with its width.
-
-```html
-<smart-grid square>
-  <smart-grid-item icon="photo-o" text="Text" ty:for="{{ 8 }}" />
-</smart-grid>
-```
-
-### Grid Spacing
-
-Use the `gutter` attribute to set the distance between grids.
-
-```html
-<smart-grid gutter="{{ 10 }}">
-  <smart-grid-item icon="photo-o" text="Text" ty:for="{{ 8 }}" />
-</smart-grid>
-```
-
-### Horizontal Content
-
-Set the `direction` attribute to `horizontal` to make the grid content horizontal.
-
-```html
-<smart-grid direction="horizontal" column-num="2">
-  <smart-grid-item icon="photo-o" text="Text" />
-  <smart-grid-item icon="photo-o" text="Text" />
-  <smart-grid-item icon="photo-o" text="Text" />
-</smart-grid>
-```
-
-### Page Navigation
-
-Use the `url` attribute for page navigation and the `link-type` to control the navigation type.
-
-```html
-<smart-grid clickable column-num="2">
-  <smart-grid-item
-    icon="home-o"
-    link-type="navigateTo"
-    url="/pages/dashboard/index"
-    text="Navigate"
-  />
-  <smart-grid-item
-    icon="search"
-    link-type="reLaunch"
-    url="/pages/dashboard/index"
-    text="ReLaunch"
-  />
-</smart-grid>
-```
-
-### Notifications
-
-The `dot` attribute displays a small red dot in the top-right corner of the icon. The `badge` attribute shows a corresponding badge.
-
-```html
-<smart-grid column-num="2">
-  <smart-grid-item icon="home-o" text="Text" dot />
-  <smart-grid-item icon="search" text="Text" badge="99+" />
-</smart-grid>
-```
-
-## API
-
-### Grid Props
-
-| Parameter          | Description                                    | Type               | Default    |
-| ------------------ | ---------------------------------------------- | ------------------ | ---------- |
-| border             | Whether to display a border                     | _boolean_          | `true`     |
-| center             | Whether to center the grid content              | _boolean_          | `true`     |
-| clickable          | Whether to enable grid click feedback           | _boolean_          | `false`    |
-| column-num         | Number of columns                               | _number_           | `4`        |
-| direction          | Content direction, options are `horizontal`     | _string_           | `vertical` |
-| gutter             | Space between grids, default unit is `px`       | _string \| number_ | `0`        |
-| icon-size `v1.3.2` | Icon size, default unit is `px`                 | _string_           | `28px`     |
-| reverse `v1.7.0`   | Swap icon and text positions                    | _boolean_          | `false`    |
-| square             | Fix the grid as a square                        | _boolean_          | `false`    |
-| use-slot           | Use customization slot                          | _boolean_          | `false`    |
-
-### External Grid Style Class
-
-| Class Name    | Description    |
-| ------------- | -------------- |
-| custom-class  | Root node style class |
-
-### GridItem Props
-
-| Parameter            | Description                                                   | Type               | Default       |
-| -------------------- | ------------------------------------------------------------- | ------------------ | ------------- |
-| badge                | Content of the top-right badge of the icon                     | _string \| number_ | -             |
-| dot                  | Show a small red dot on the top-right of the icon              | _boolean_          | `false`       |
-| icon                 | Icon Svg Value or image link, see [Icon Component](/material/smartui?comId=icon&appType=miniapp)         | _string_           | -             |
-| icon-color           | Icon color                                                    | _string_           | -             |
-| icon-prefix `v1.7.0` | Third-party icon prefix                                        | _string_           | `smart-icon`  |
-| link-type            | Link jump type, options are `redirectTo` `switchTab` `reLaunch` | _string_           | `navigateTo`  |
-| text                 | Text                                                          | _string_           | -             |
-| url                  | Link address to jump to when clicked                           | _string_           | -             |
-
-### GridItem Events
-
-| Event Name  | Description     | Callback Parameter |
-| ----------- | --------------- | ------------------ |
-| bind:click  | Triggered when the grid is clicked | -                |
-
-### GridItem Slots
-
-| Name    | Description                                                |
-| ------- | ---------------------------------------------------------- |
-| -       | Customize all grid content, need to set `use-slot` attribute |
-| icon    | Custom icon, ineffective if `use-slot` or `icon` attribute is set |
-| text    | Custom text, ineffective if `use-slot` or `text` attribute is set |
-
-### External GridItem Style Class
-
-| Class Name     | Description     |
-| -------------- | --------------- |
-| content-class  | Content style class |
-| custom-class   | Root node style class |
-| icon-class     | Icon style class |
-| text-class     | Text style class |
-
-### Style Variables
-
-The component provides the following CSS variables that can be used for custom styles. For usage, refer to the [ConfigProvider Component](/material/smartui?comId=config-provider&appType=miniapp).
-
-| Name                          | Default Value                           | Description           |
-| ----------------------------- | ---------------------------------------- | --------------------- |
-| --grid-item-content-padding   | _@padding-md @padding-xs_                | Content padding       |
-| --grid-item-content-background-color | _var(--app-B3, #ffffff)_         | Background color      |
-| --grid-item-content-active-color | _#f2f3f5_                           | Active color          |
-| --grid-item-icon-size         | _26px_                                   | Icon size             |
-| --grid-item-text-color        | _var(--app-B6-N2, rgba(0, 0, 0, 0.7))_   | Text color            |
-| --grid-item-text-font-size    | _12px_                                   | Text font size        |

package/packages/grid/README.md

@@ -1,196 +0,0 @@
----
-category: 布局
----
-
-# Grid 宫格
-
-### 介绍
-
-宫格可以在水平方向上把页面分隔成等宽度的区块，用于展示内容或进行页面导航。
-
-### 引入
-
-在`app.json`或`index.json`中引入组件，详细介绍见[快速上手](/material/smartui?comId=help-getting-started&appType=miniapp)。
-
-```json
-"usingComponents": {
-  "smart-grid": "@tuya-miniapp/smart-ui/lib/grid/index",
-  "smart-grid-item": "@tuya-miniapp/smart-ui/lib/grid-item/index"
-}
-```
-
-## 代码演示
-
-### 基本用法
-
-通过`icon`属性设置格子内的图标，`text`属性设置文字内容。
-
-```html
-<smart-grid>
-  <smart-grid-item icon="photo-o" text="文字" />
-  <smart-grid-item icon="photo-o" text="文字" />
-  <smart-grid-item icon="photo-o" text="文字" />
-  <smart-grid-item icon="photo-o" text="文字" />
-</smart-grid>
-```
-
-### 自定义列数
-
-默认一行展示四个格子，可以通过`column-num`自定义列数。
-
-```html
-<smart-grid column-num="3">
-  <smart-grid-item icon="photo-o" text="文字" ty:for="{{ 6 }}" />
-</smart-grid>
-```
-
-### 自定义内容
-
-通过插槽可以自定义格子展示的内容。
-
-```html
-<smart-grid column-num="3" border="{{ false }}">
-  <smart-grid-item use-slot ty:for="{{ 3 }}" ty:for-item="index">
-    <image
-      style="width: 90px; height: 90px;"
-      src="https://static1.tuyacn.com/static/tuya-miniapp-doc/_next/static/images/logo-small.png"
-    />
-  </smart-grid-item>
-</smart-grid>
-```
-
-### 正方形格子
-
-设置`square`属性后，格子的高度会和宽度保持一致。
-
-```html
-<smart-grid square>
-  <smart-grid-item icon="photo-o" text="文字" ty:for="{{ 8 }}" />
-</smart-grid>
-```
-
-### 格子间距
-
-通过`gutter`属性设置格子之间的距离。
-
-```html
-<smart-grid gutter="{{ 10 }}">
-  <smart-grid-item icon="photo-o" text="文字" ty:for="{{ 8 }}" />
-</smart-grid>
-```
-
-### 内容横排
-
-将`direction`属性设置为`horizontal`，可以让宫格的内容呈横向排列。
-
-```html
-<smart-grid direction="horizontal" column-num="2">
-  <smart-grid-item icon="photo-o" text="文字" />
-  <smart-grid-item icon="photo-o" text="文字" />
-  <smart-grid-item icon="photo-o" text="文字" />
-</smart-grid>
-```
-
-### 页面跳转
-
-可以通过`url`属性进行页面跳转，通过`link-type`属性控制跳转类型。
-
-```html
-<smart-grid clickable column-num="2">
-  <smart-grid-item
-    icon="home-o"
-    link-type="navigateTo"
-    url="/pages/dashboard/index"
-    text="Navigate 跳转"
-  />
-  <smart-grid-item
-    icon="search"
-    link-type="reLaunch"
-    url="/pages/dashboard/index"
-    text="ReLaunch 跳转"
-  />
-</smart-grid>
-```
-
-### 提示信息
-
-设置`dot`属性后，会在图标右上角展示一个小红点。设置`badge`属性后，会在图标右上角展示相应的徽标。
-
-```html
-<smart-grid column-num="2">
-  <smart-grid-item icon="home-o" text="文字" dot />
-  <smart-grid-item icon="search" text="文字" badge="99+" />
-</smart-grid>
-```
-
-## API
-
-### Grid Props
-
-| 参数               | 说明                                      | 类型               | 默认值     |
-| ------------------ | ----------------------------------------- | ------------------ | ---------- |
-| border             | 是否显示边框                              | _boolean_          | `true`     |
-| center             | 是否将格子内容居中显示                    | _boolean_          | `true`     |
-| clickable          | 是否开启格子点击反馈                      | _boolean_          | `false`    |
-| column-num         | 列数                                      | _number_           | `4`        |
-| direction          | 格子内容排列的方向，可选值为 `horizontal` | _string_           | `vertical` |
-| gutter             | 格子之间的间距，默认单位为`px`            | _string \| number_ | `0`        |
-| icon-size `v1.3.2` | 图标大小，默认单位为`px`                  | _string_           | `28px`     |
-| reverse `v1.7.0`   | 是否调换图标和文本的位置                  | _boolean_          | `false`    |
-| square             | 是否将格子固定为正方形                    | _boolean_          | `false`    |
-| use-slot           | 是否使用自定义内容的插槽                  | _boolean_          | `false`    |
-
-### Grid 外部样式类
-
-| 类名         | 说明         |
-| ------------ | ------------ |
-| custom-class | 根节点样式类 |
-
-### GridItem Props
-
-| 参数                 | 说明                                                       | 类型               | 默认值       |
-| -------------------- | ---------------------------------------------------------- | ------------------ | ------------ |
-| badge                | 图标右上角徽标的内容                                       | _string \| number_ | -            |
-| dot                  | 是否显示图标右上角小红点                                   | _boolean_          | `false`      |
-| icon                 | 图标svg值或图片链接，可选值见 [Icon 组件](/material/smartui?comId=icon&appType=miniapp)           | _string_           | -            |
-| icon-color           | 图标颜色                                                   | _string_           | -            |
-| icon-prefix `v1.7.0` | 第三方图标前缀                                             | _string_           | `smart-icon` |
-| link-type            | 链接跳转类型，可选值为 `redirectTo` `switchTab` `reLaunch` | _string_           | `navigateTo` |
-| text                 | 文字                                                       | _string_           | -            |
-| url                  | 点击后跳转的链接地址                                       | _string_           | -            |
-
-### GridItem Events
-
-| 事件名     | 说明           | 回调参数 |
-| ---------- | -------------- | -------- |
-| bind:click | 点击格子时触发 | -        |
-
-### GridItem Slots
-
-| 名称 | 说明                                                   |
-| ---- | ------------------------------------------------------ |
-| -    | 自定义宫格的所有内容，需要设置`use-slot`属性           |
-| icon | 自定义图标，如果设置了`use-slot`或者`icon`属性则不生效 |
-| text | 自定义文字，如果设置了`use-slot`或者`text`属性则不生效 |
-
-### GridItem 外部样式类
-
-| 类名          | 说明         |
-| ------------- | ------------ |
-| content-class | 内容样式类   |
-| custom-class  | 根节点样式类 |
-| icon-class    | 图标样式类   |
-| text-class    | 文本样式类   |
-
-### 样式变量
-
-组件提供了下列 CSS 变量，可用于自定义样式，使用方法请参考 [ConfigProvider 组件](/material/smartui?comId=config-provider&appType=miniapp)。
-
-| 名称                          | 默认值                                 | 描述 |
-| ----------------------------- | -------------------------------------- | ---- |
-| --grid-item-content-padding | _@padding-md @padding-xs_ | 内容内边距 |
-| --grid-item-content-background-color | _var(--app-B3, #ffffff)_ | 背景颜色 |
-| --grid-item-content-active-color | _#f2f3f5_ | 激活时颜色 |
-| --grid-item-icon-size | _26px_ | 图标大小 |
-| --grid-item-text-color | _var(--app-B6-N2, rgba(0, 0, 0, 0.7))_ | 文本颜色 |
-| --grid-item-text-font-size | _12px_ | 文本字体大小 |