refactor(rate): move to script setup (jd-opensource#2966)

src/config.json

@@ -406,6 +406,7 @@
           "name": "Rate",
           "cName": "评分",
           "desc": "评分组件",
+          "setup": true,
           "author": "undo"
         },
         {

src/packages/__VUE/comment/components/CmtHeader.taro.vue

@@ -34,7 +34,7 @@
 <script lang="ts">
 import { createComponent } from '@/packages/utils/create';
 const { create } = createComponent('comment-header');
-import NutRate from '../../rate/index.taro.vue';
+import NutRate from '../../rate/index.taro';
 
 export default create({
   components: {

src/packages/__VUE/comment/components/CmtHeader.vue

@@ -34,7 +34,7 @@
 <script lang="ts">
 import { createComponent } from '@/packages/utils/create';
 const { create } = createComponent('comment-header');
-import NutRate from '../../rate/index.vue';
+import NutRate from '../../rate/index';
 
 export default create({
   components: {

src/packages/__VUE/form/__tests__/index.spec.tsx

@@ -6,7 +6,7 @@ import Textarea from '../../textarea/index.vue';
 import Button from '../../button';
 import Switch from '../../switch/index.vue';
 import Checkbox from '../../checkbox/index.vue';
-import Rate from '../../rate/index.vue';
+import Rate from '../../rate';
 import InputNumber from '../../inputnumber';
 import Range from '../../range/index.vue';
 import Uploader from '../../uploader/index.vue';

src/packages/__VUE/rate/__tests__/__snapshots__/rate.spec.tsx.snap

@@ -1,6 +1,6 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`custom icon 1`] = `
+exports[`Icon: custom icon 1`] = `
 "<svg class="nut-rate-item__icon nut-rate-item__icon--disabled nut-icon nut-icon-Check" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" role="presentation">
   <path d="M998.4 245.029c-219.429 153.6-398.629 332.8-552.229 552.228-40.228 58.514-128 54.857-164.571-3.657-69.486-106.057-149.943-186.514-256-256-51.2-32.914-18.286-113.371 40.229-98.743C182.857 460.8 274.286 508.343 358.4 585.143c157.257-190.172 358.4-340.114 588.8-435.2 62.171-25.6 106.057 58.514 51.2 95.086" fill="currentColor" fill-opacity="0.9"></path>
 </svg>"

src/packages/__VUE/rate/__tests__/rate.spec.tsx

@@ -1,21 +1,22 @@
 import { mount } from '@vue/test-utils';
-import Rate from '../index.vue';
-import { h, nextTick } from 'vue';
+import Rate from '..';
+import { h, nextTick, ref } from 'vue';
 import { Check } from '@nutui/icons-vue';
+import { triggerDrag } from '@/packages/utils/unit';
 
-test('base rate', () => {
+test('Icon: base rate', () => {
   const wrapper = mount(Rate);
   const rate = wrapper.find('.nut-rate');
   expect(rate.exists()).toBe(true);
 });
 
-test('should have rate when v-model', () => {
+test('Icon: should have rate when v-model', () => {
   const wrapper = mount(Rate, { props: { modelValue: 4 } });
   const rate = wrapper.findAll('.nut-rate-item__icon--disabled');
   expect(rate.length).toBe(1);
 });
 
-test('should have the same count and activeColor', () => {
+test('Icon: should have the same count and active-color', () => {
   const wrapper = mount(Rate, {
     props: { count: 10, activeColor: 'green', modelValue: 1 }
   });
@@ -27,7 +28,7 @@ test('should have the same count and activeColor', () => {
   expect((i[1].element as HTMLElement).style.color).toBe('');
 });
 
-test('should have click', async () => {
+test('Icon: should have click', async () => {
   const wrapper = mount(Rate, {
     props: {
       modelValue: 1,
@@ -42,7 +43,7 @@ test('should have click', async () => {
   expect((wrapper.emitted('change') as any)[0][0]).toEqual(3);
 });
 
-test('should have disabled', async () => {
+test('Icon: should have disabled', async () => {
   const wrapper = mount(Rate, {
     props: {
       disabled: true,
@@ -57,7 +58,7 @@ test('should have disabled', async () => {
   expect(rateDis.length).toBe(5);
 });
 
-test('should have readonly', async () => {
+test('Icon: should have readonly', async () => {
   const wrapper = mount(Rate, { props: { readonly: true, modelValue: 4 } });
   const rate = wrapper.findAll('.nut-rate-item');
   rate[1].trigger('click');
@@ -66,7 +67,7 @@ test('should have readonly', async () => {
   expect(rateDis.length).toBe(1);
 });
 
-test('custom icon', async () => {
+test('Icon: custom icon', async () => {
   const wrapper = mount(Rate, {
     props: {
       customIcon: h(Check)
@@ -75,3 +76,34 @@ test('custom icon', async () => {
   const icon = wrapper.find('.nut-icon');
   expect(icon.html()).toMatchSnapshot();
 });
+
+test('Icon: allow-half', async () => {
+  const val = ref(1.5);
+  const fn = vi.fn();
+  const wrapper = mount(() => {
+    return <Rate v-model={val.value} allowHalf onChange={fn} />;
+  });
+  const halfIcons = wrapper.findAll('.nut-rate-item__icon--half .nut-rate-item__icon');
+  expect(halfIcons.length).toBe(5);
+  halfIcons[3].trigger('click');
+  await nextTick();
+  expect(fn).toBeCalledWith(3.5);
+  expect(val.value).toBe(3.5);
+});
+
+test('Icon: touchable', async () => {
+  const val = ref(1);
+  const fn = vi.fn();
+  const wrapper = mount(() => {
+    return <Rate v-model={val.value} touchable onChange={fn} />;
+  });
+  const rate = wrapper.find('.nut-rate');
+
+  triggerDrag(rate, 20, 0);
+  await nextTick();
+  expect(val.value).toBe(5);
+
+  triggerDrag(rate, -20, 0);
+  await nextTick();
+  expect(val.value).toBe(0);
+});

src/packages/__VUE/rate/doc.en-US.md

@@ -74,6 +74,17 @@ app.use(Rate);
 | --- | --- | --- |
 | change | An event that fires whenever the current score is modified | val |
 
+### Types version
+
+The component exports the following type definitions:
+
+```js
+import type {
+  RateProps,
+  RateInstance
+} from '@nutui/nutui';
+```
+
 ## Theming
 
 ### CSS Variables

src/packages/__VUE/rate/doc.md

@@ -74,6 +74,17 @@ app.use(Rate);
 | --- | --- | --- |
 | change | 当前分值修改时时触发的事件 | 当前值 |
 
+### 类型定义 version
+
+组件导出以下类型定义：
+
+```js
+import type {
+  RateProps,
+  RateInstance
+} from '@nutui/nutui';
+```
+
 ## 主题定制
 
 ### 样式变量

src/packages/__VUE/rate/doc.taro.md

@@ -73,6 +73,17 @@ app.use(Rate);
 | --- | --- | --- |
 | change | 当前分值修改时时触发的事件 | 当前值 |
 
+### 类型定义 version
+
+组件导出以下类型定义：
+
+```js
+import type {
+  RateProps,
+  RateInstance
+} from '@nutui/nutui-taro';
+```
+
 ## 主题定制
 
 ### 样式变量

src/packages/__VUE/rate/index.taro.ts

@@ -0,0 +1,11 @@
+import Rate from './rate.taro.vue';
+import type { ComponentPublicInstance } from 'vue';
+import { withInstall } from '@/packages/utils';
+
+withInstall(Rate);
+
+export type { RateProps } from './rate.taro.vue';
+
+export type RateInstance = ComponentPublicInstance & InstanceType<typeof Rate>;
+
+export { Rate, Rate as default };

src/packages/__VUE/rate/index.ts

@@ -0,0 +1,11 @@
+import Rate from './rate.vue';
+import type { ComponentPublicInstance } from 'vue';
+import { withInstall } from '@/packages/utils';
+
+withInstall(Rate);
+
+export type { RateProps } from './rate.vue';
+
+export type RateInstance = ComponentPublicInstance & InstanceType<typeof Rate>;
+
+export { Rate, Rate as default };